更新文档

docs/_sidebar.md

@@ -23,15 +23,18 @@
         * [🦖 Chrome 启动配置]('使用方法\启动配置\Chrome启动配置.md')
         * [🦕 Session 启动配置](使用方法\启动配置\Session启动配置.md)
         * [🐊 使用配置文件](使用方法\启动配置\使用配置文件.md)
-    * [🐼 下载文件](使用方法\下载文件.md)
-    * [🐨 cookies 的使用](使用方法\cookies的使用.md)
-    * [🐰 Drission 对象](使用方法\Drission对象.md)
-    * [🐹 对接 selenium 及 requests 代码](使用方法\对接selenium及requests代码.md)
-    * [🦇 使用其它浏览器](使用方法\使用其它浏览器.md)
-    * [🦒 DriverPage 和 SessionPage](使用方法\DriverPage和SessionPage.md)
-    * [🐭 打包程序](使用方法\打包程序.md)
+  * [🐼 下载文件](使用方法\下载文件.md)
+  * [🐨 cookies 的使用](使用方法\cookies的使用.md)
+  * [🐰 Drission 对象](使用方法\Drission对象.md)
+  * [🐹 对接 selenium 及 requests 代码](使用方法\对接selenium及requests代码.md)
+  * [🦇 使用其它浏览器](使用方法\使用其它浏览器.md)
+  * [🦒 DriverPage 和 SessionPage](使用方法\DriverPage和SessionPage.md)
+  * [🐭 打包程序](使用方法\打包程序.md)
 
 * 💖 实用示例
+    * [🧡 自动登录码云](实用示例\自动登录码云.md)
+    * [🧡 获取各国疫情排名](实用示例\获取各国疫情排名.md)
+    * [🧡 下载星巴克产品图片](实用示例\下载星巴克产品图片.md)
     * [🧡 同时操作多个浏览器](实用示例\同时操作多个浏览器.md)
 
 * [✨️ Tips大集合](Tips大集合.md)

docs/实用示例/自动登录码云.md

@@ -0,0 +1,42 @@
+此示例演示使用控制浏览器的方式自动登录 gitee 网站。
+
+# 网页分析
+
+网址：https://gitee.com/login
+
+![](https://gitee.com/g1879/DrissionPage-demos/raw/master/pics/QQ%E6%88%AA%E5%9B%BE20220118000233.jpg)
+
+按`F12`查看代码，可见两个输入框都可用`id`属性定位，如图所示。
+
+![](https://gitee.com/g1879/DrissionPage-demos/raw/master/pics/QQ截图20220118000346.jpg)
+
+# 编码思路
+
+有`id`属性的元素获取非常简单。两个输入框直接用`id`属性定位即可。  
+登录按钮没有`id`属性，但可观察到它是第一个`value`属性为`'登 录'`的元素，用中文定位也可以增强代码可读性。
+
+# 示例代码
+
+```python
+from DrissionPage import MixPage
+
+# 用 d 模式创建页面对象（默认模式）
+page = MixPage()
+# 跳转到登录页面
+page.get('https://gitee.com/login')
+
+# 定位到账号文本框并输入账号
+page.ele('#user_login').input('你的账号')
+# 定位到密码文本框并输入密码
+page.ele('#user_password').input('你的密码')
+
+# 点击登录按钮
+page.ele('@value=登 录').click()
+```
+
+# 结果
+
+登录成功。
+
+![](https://gitee.com/g1879/DrissionPage-demos/raw/master/pics/QQ%E6%88%AA%E5%9B%BE20220118000945.jpg)
+

docs/实用示例/获取各国疫情排名.md

@@ -0,0 +1,66 @@
+此示例爬取全球新冠情况排行榜。该网站是纯 html 页面，特别适合 s 模式爬取和解析。
+
+# 页面分析
+
+网址：https://www.outbreak.my/zh/world
+
+目标：获取所有国家疫情排名信息，并显示出来。
+
+![](https://gitee.com/g1879/DrissionPage-demos/raw/master/pics/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20211231225026.jpg)
+
+按`F12`观察页面代码，可以发现：
+
+- 标题栏有写列是不显示的，它们的`style`属性包含`display: none;`
+- 表格内容中 3、5、7 列的真正数据在隐藏的 2、4、6 列中
+
+![标题栏](https://gitee.com/g1879/DrissionPage-demos/raw/master/pics/QQ截图20220118002732.jpg)
+
+![内容列](https://gitee.com/g1879/DrissionPage-demos/raw/master/pics/QQ截图20220118002945.jpg)
+
+因此，在获取标题栏时，要跳过隐藏的列，在获取正文内容时，反而要用隐藏的数据。
+
+# 示例代码
+
+```python
+from DrissionPage import MixPage
+
+# 用 s 模式创建页面对象
+page = MixPage('s')  
+# 访问数据网页
+page.get('https://www.outbreak.my/zh/world')  
+
+# 获取表头元素
+thead = page('tag:thead')  
+# 获取表头列，跳过其中的隐藏的列
+title = thead.eles('tag:th@@-style:display: none;')  
+data = [th.text for th in title]
+
+print(data)  # 打印表头
+
+# 获取内容表格元素
+tbody = page('tag:tbody')  
+# 获取表格所有行
+rows = tbody.eles('tag:tr')  
+
+for row in rows: 
+    # 获取当前行所有列
+    cols = row.eles('tag:td')  
+    # 生成当前行数据列表（跳过其中没用的几列）
+    data = [td.text for k, td in enumerate(cols) if k not in (2, 4, 6)]
+    
+    print(data)  # 打印行数据
+```
+
+# 结果
+
+```
+['总 (205)', '累积确诊', '死亡', '治愈', '现有确诊', '死亡率', '恢复率']
+['美国', '55252823', '845745', '41467660', '12,939,418', '1.53%', '75.05%']
+['印度', '34838804', '481080', '34266363', '91,361', '1.38%', '98.36%']
+['巴西', '22277239', '619024', '21567845', '90,370', '2.78%', '96.82%']
+['英国', '12748050', '148421', '10271706', '2,327,923', '1.16%', '80.57%']
+['俄罗斯', '10499982', '308860', '9463919', '727,203', '2.94%', '90.13%']
+['法国', '9740600', '123552', '8037752', '1,579,296', '1.27%', '82.52%']
+......
+```
+