python selenium-webdriver 下拉菜单处理（九）

时间 2019-12-06

标签 python selenium webdriver 下拉菜单处理栏目 Python 繁體版

原文原文链接

测试过程当中常常遇到下来菜单，好比说分页，每页显示的条数，以及语言的切换，不少时候常常是如下来菜单的形式展示，下面咱们看一下selenium如何处理下来菜单。html

首先selenium 很人性化的给提供了一个Select的模块，供处理下来菜单，首先咱们须要导入Select，经过from selenium.webdriver.support.select import Select来导入。web

Select中提供几个用于定位的option的方法,下面看一下具体的方法测试

主要把Select方法总结了一下分为三大类：ui

1.选择列表spa

select_by_index(self, index) 　　#以index属性值来查找匹配的元素并选择；
select_by_value(self, value) #以value属性值来查找该option并选择；
select_by_visible_text(self, text) #以text文本值来查找匹配的元素并选择；
first_selected_option(self) #选择第一个option 选项；

为了测试以上的方法，从网上找的了一个简单的页面，来辅助测试3d

<html>
<body>
    <form>
        <select name="cars">
            <option value="volvo">Volvo</option>
            <option value="saab">Saab</option>
            <option value="fiat" selected="selected">Fiat</option>
            <option value="audi">Audi</option>
        </select>
    </form>
</body>
</html>

针对按索引进行切换option属性示例以下。经常使用方法code

#-*- coding:utf-8 -*-
import time
from selenium import webdriver
from selenium.webdriver.support.select import Select
driver = webdriver.Chrome()
driver.maximize_window()
driver.get('file:///C:/Users/hunk/Desktop/select.html')
time.sleep(2)   #默认option显示"Fiat"
S = Select(driver.find_element_by_name('cars')).select_by_index(0)  #实例化Select,按索引选择option。索引以0开始
time.sleep(2)   #切换后option显示"Volvo"
driver.quit()

针对按value进行切换option属性示例以下。经常使用方法orm

#-*- coding:utf-8 -*-
import time
from selenium import webdriver
from selenium.webdriver.support.select import Select
driver = webdriver.Chrome()
driver.maximize_window()
driver.get('file:///C:/Users/hunk/Desktop/select.html')
time.sleep(2)   #默认option显示"Fiat"
S = Select(driver.find_element_by_name('cars')).select_by_value('saab')  #实例化Select,按value选择option。这里的value是标签的属性value，<option value="saab">Saab</option>
time.sleep(2)   #切换后option显示"saab"
driver.quit()

针对按text文本进行切换option属性示例以下。经常使用方法htm

#-*- coding:utf-8 -*-
import time
from selenium import webdriver
from selenium.webdriver.support.select import Select
driver = webdriver.Chrome()
driver.maximize_window()
driver.get('file:///C:/Users/hunk/Desktop/select.html')
time.sleep(2)   #默认option显示"Fiat"
S = Select(driver.find_element_by_name('cars')).select_by_visible_text ('Audi')  #实例化Select,text值是选择的咱们下拉菜单时看到的值
time.sleep(2)   #切换后option显示"Audi"
driver.quit()

使用first_selected_option(self) 来切换到第一个option，该方法与select_by_index(0)实现的效果相同，直接看一下代码执行效果，详细的就解释了blog

#-*- coding:utf-8 -*-
import time
from selenium import webdriver
from selenium.webdriver.support.select import Select
driver = webdriver.Chrome()
driver.maximize_window()
driver.get('file:///C:/Users/hunk/Desktop/select.html')
time.sleep(2)   #默认option显示"Fiat"
S = Select(driver.find_element_by_name('cars')).first_selected_option
time.sleep(2)   #切换后option显示"Audi"
driver.quit()

2.清除选择列表

第一类咱们讲解了如何选择列表，总共介绍了4种方法，可是既然能够选择咱们就能够清除选择，而前三种取消方法能够与选择一一对应，下面咱们看下如何清除选择

deselect_by_index(self, index) #以index属性值来查找匹配的元素并取消选择；
deselect_by_value(self, value) #以value属性值来查找该option并取消选择；
deselect_by_visible_text(self, text) 　　#以text文本值来查找匹配的元素并取消选择；
deselect_all(self) #将全部选择清除；

由于按照上面的页面示例，咱们切换完成之后是没有办法清除，下面咱们来普及一下html <select> 标签的multiple 属性，multiple 属性规定可同时选择多个选项，能够把 multiple 属性与 size 属性配合使用，来定义可见选项的数目，因此咱们会涉及到取消模式。

下面是不包含multiple 和包含 multiple 的两种样式

<select> 标签样式

<select> 标签的multiple 属性样式

因为选择已经介绍的很详细，那么咱们配合的选择和取消，写一个例子共同演示一下

辅助测试的页面html代码

<html>
<body>
    <select name="cars" multiple="multiple" size="4">
        <option value="volvo">Volvo</option>
        <option value="saab">Saab</option>
        <option value="mercedes">Mercedes</option>
        <option value="audi">Audi</option>
    </select>
</body>
</html>

首先咱们经过index、value、text文本三种方式进行选择，而后再次按index、value、text 进行取消，最后遍历全部的option循环选择，最后所有取消。

#-*- coding:utf-8 -*-
import time
from selenium import webdriver
from selenium.webdriver.support.select import Select
driver = webdriver.Chrome()
driver.maximize_window()
driver.get('file:///C:/Users/hunk/Desktop/select.html')
'''本示例中全部设置等待时间均为便于观察效果'''
time.sleep(1)
Select(driver.find_element_by_name('cars')).select_by_index(0)  #以索引选择
time.sleep(1) 
Select(driver.find_element_by_name('cars')).select_by_value('saab')  #以value属性值选择
time.sleep(1) 
Select(driver.find_element_by_name('cars')).select_by_visible_text('Mercedes') #以text 文本进行选择
time.sleep(2)
Select(driver.find_element_by_name('cars')).deselect_by_index(0)
time.sleep(1)
Select(driver.find_element_by_name('cars')).deselect_by_value('saab')  #以value属性值取消选择
time.sleep(1) 
Select(driver.find_element_by_name('cars')).deselect_by_visible_text('Mercedes') #以text 文本进行取消选择
time.sleep(1)
'''获取全部的option的text值,进行遍历经过text文本进行选择'''
Options = Select(driver.find_element_by_name('cars')).options #该方法下面会详细介绍，此处为了获取全部的options选项
for option in Options:
    Select(driver.find_element_by_name('cars')).select_by_visible_text(option.text)  #循环选择
time.sleep(1)
Select(driver.find_element_by_name('cars')).deselect_all()
time.sleep(1)
driver.quit()

代码逻辑不重要，重要的是看效果，以下显示

3.选项

虽然选项没有上面两大块那么重要，可是咱们还须要简单的来看一下

options 　　 #以列表形式返回属于此select标签的全部option
all_selected_options #所有选择了的option的列表
first_selected_option #第一个被选中的option元素若是select没有multiple值，此时获取值为当前选择的option

option 方法上面的例子已经使用过了，下面咱们来介绍一下

def options(self):
    '''以列表形式返回属于此select标签的全部option'''
    return self._el.find_elements(By.TAG_NAME, 'option')

示例：

#-*- coding:utf-8 -*-

from selenium import webdriver
from selenium.webdriver.support.select import Select
driver = webdriver.Chrome()
driver.maximize_window()
driver.get('file:///C:/Users/hunk/Desktop/select.html')
S = Select(driver.find_element_by_name('cars')).options  #实例化Select,而且获取全部的options
for option in S:  #遍历options
    print(option.text) #获取option值
driver.quit()

咱们结合着上面的例子把剩下的两种option方法一块儿演示下，下面在上面的例子进行改造一下，来看看会出现上面样子的效果

#-*- coding:utf-8 -*-
import time
from selenium import webdriver
from selenium.webdriver.support.select import Select
driver = webdriver.Chrome()
driver.maximize_window()
driver.get('file:///C:/Users/hunk/Desktop/select.html')
'''本示例中全部设置等待时间均为便于观察效果'''
time.sleep(1)
Select(driver.find_element_by_name('cars')).select_by_index(0)  #以索引选择
time.sleep(1) 
Select(driver.find_element_by_name('cars')).select_by_value('saab')  #以value属性值选择
time.sleep(1) 
Select(driver.find_element_by_name('cars')).select_by_visible_text('Mercedes') #以text 文本进行选择
time.sleep(2)
options = Select(driver.find_element_by_name('cars')).all_selected_options  #获取全部选择的option
'''这里咱们遍历下看看那些值被选中'''
for option in options:
    print('已经被选中option文本值:' + option.text)
Select(driver.find_element_by_name('cars')).deselect_by_index(0)
time.sleep(1)
Select(driver.find_element_by_name('cars')).deselect_by_value('saab')  #以value属性值取消选择
time.sleep(1) 
Select(driver.find_element_by_name('cars')).deselect_by_visible_text('Mercedes') #以text 文本进行取消选择
time.sleep(1)
'''获取全部的option的text值,进行遍历经过text文本进行选择'''
Options = Select(driver.find_element_by_name('cars')).options #该方法下面会详细介绍，此处为了获取全部的options选项
for option in Options:
    Select(driver.find_element_by_name('cars')).select_by_visible_text(option.text)  #循环选择
time.sleep(1)
'''由于遍历的过程当中Volvo的索引为0,Volvo则被第一个选中'''
selectOption = Select(driver.find_element_by_name('cars')).first_selected_option
print (selectOption.text)
Select(driver.find_element_by_name('cars')).deselect_all()
time.sleep(1)
driver.quit()

咱们把option添加之后，控制台打印了一下效果，看看是不是获取了对应的值

上述把Select模块中经常使用的方法介绍了，经过两种不一样的下拉菜单，对全部的方法进行了介绍，我采用红色标记的方法是咱们实际项目中常常会使用的，须要更加深入的去理解。

1. Python webdriver API（十一）下拉菜单处理
2. 下拉菜单
3. 动画导航菜单,下拉菜单,多级下拉菜单
4. jQuery下拉菜单
5. Bootstrap 下拉菜单
6. Bootstrap-下拉菜单
7. CSS下拉菜单
8. dropdown 下拉菜单
9. CSS 下拉菜单
10. Spinner--下拉菜单
更多相关文章...
• ionic 上拉菜单(ActionSheet) - ionic 教程
• ionic 下拉刷新 - ionic 教程
• RxJava操作符（九）Connectable Observable Operators
• Docker 清理命令

python selenium-webdriver 下拉菜单处理 （九）

python selenium-webdriver 下拉菜单处理（九）