选择框
并且按F12,观察HTML的内容
常见的选择框包括: radio框、checkbox框、select框
radio框
radio框选择选项,直接用WebElement的click方法,模拟用户点击就可以了。
比如, 我们要在下面的html中:
- 先打印当前选中的老师名字
- 再选择 小雷老师
<div id="s_radio">
<input type="radio" name="teacher" value="小江老师">小江老师<br>
<input type="radio" name="teacher" value="小雷老师">小雷老师<br>
<input type="radio" name="teacher" value="小凯老师" checked="checked">小凯老师
</div>
对应的代码如下
其中 #s_radio input[name="teacher"]:checked
里面的 :checked
是CSS伪类选择
表示选择 checked
状态的元素,对 radio
和 checkbox
类型的input有效
checkbox框
对checkbox进行选择,也是直接用 WebElement 的 click 方法,模拟用户点击选择。
需要注意的是,要选中checkbox的一个选项,必须 先获取当前该复选框的状态
,如果该选项已经勾选了,就不能再点击。否则反而会取消选择。
比如, 我们要在下面的html中:选中 小雷老师
<div id="s_checkbox">
<input type="checkbox" name="teacher" value="小江老师">小江老师<br>
<input type="checkbox" name="teacher" value="小雷老师">小雷老师<br>
<input type="checkbox" name="teacher" value="小凯老师" checked="checked">小凯老师
</div>
我们的思路可以是这样:
- 先把 已经选中的选项全部点击一下,确保都是未选状态
- 再点击 小雷老师
示例代码
# 先把 已经选中的选项全部点击一下
elements = wd.find_elements(By.CSS_SELECTOR,
'#s_checkbox input[name="teacher"]:checked')
for element in elements:
element.click()
# 再点击 小雷老师
wd.find_element(By.CSS_SELECTOR,
"#s_checkbox input[value='小雷老师']").click()
select框
radio框及checkbox框都是input元素,只是里面的type不同而已。
select框 则是一个新的select标签,大家可以对照浏览器网页内容查看一下
对于Select 选择框, Selenium 专门提供了一个 Select类
进行操作。
Select类 提供了如下的方法
- select_by_value
根据选项的 value属性值
,选择元素。
比如,下面的HTML,
就可以根据 foo 这个值选择该选项,
- select_by_index
根据选项的 次序
(从0开始),选择元素
注意:视频讲解中用的是老版本的seleium,那时是从 1
开始,
现在Selenium 4 是从 0
开始,
select_by_index(0)
,选择的是 第1个选项,
select_by_index(1)
,选择的是 第2个选项, 依此类推
- select_by_visible_text
根据选项的 可见文本
,选择元素。
比如,下面的HTML,
就可以根据 Bar 这个内容,选择该选项
- deselect_by_value
根据选项的value属性值, 去除
选中元素
- deselect_by_index
根据选项的次序,去除
选中元素
- deselect_by_visible_text
根据选项的可见文本,去除
选中元素
- deselect_all
去除
选中所有元素
Select单选框
对于 select单选框,操作比较简单:
不管原来选的是什么,直接用Select方法选择即可。
例如,选择示例里面的小雷老师,示例代码如下
# 导入Select类
from selenium.webdriver.support.ui import Select
# 创建Select对象
select = Select(wd.find_element(By.ID, "ss_single"))
# 通过 Select 对象选中小雷老师
select.select_by_visible_text("小雷老师")
Select多选框
对于select多选框,要选中某几个选项,要注意去掉原来已经选中的选项。
例如,我们选择示例多选框中的 小雷老师 和 小凯老师
可以用select类 的deselect_all方法,清除所有 已经选中 的选项。
然后再通过 select_by_visible_text方法 选择 小雷老师 和 小凯老师。
示例代码如下:
# 导入Select类
from selenium.webdriver.support.ui import Select
# 创建Select对象
select = Select(wd.find_element(By.ID, "ss_multi"))
# 清除所有 已经选中 的选项
select.deselect_all()
# 选择小雷老师 和 小凯老师
select.select_by_visible_text("小雷老师")
select.select_by_visible_text("小凯老师")
您需要高效学习,找工作? 点击咨询 报名实战班
点击查看学员就业情况
课后练习
打开前面练习下载的 白月SMS系统的测试用例文档,白月SMS系统的 安装步骤
可以参考 课程1的课后练习
完成用例 UI-0107
的自动化
实战班学员
,请联系老师获取参考答案和视频讲解
游客
也可以 分享课程 领取练习视频讲解,点击这里查看
补充练习
实战班学员请联系老师获取补充练习题