子元素选择器
使用场景
不同于后代选择器,只选择同一父元素的直接子元素
tips
后代元素:所有具有相同祖先的元素
子元素:所有具有相同的parent的元素(范围小于后代元素)
表示方法
大于号
s1与s2是父子关系
实例:#choose > option
表示选择id=choose下面的所有option子元素
扩展:
连续使用
#many>div>p.special
元素之间不存在越级
相邻兄弟元素选择器
使用场景
同一父元素的相邻子元素,两者挨在一起
表示方法
+
与是同级关系并且仅靠一起
示例:#food + div
选择第二个div元素
#food + div + div
非相邻兄弟元素选择器
使用场景
同一父元素的子元素,元素之间没有仅靠在一起
~
与是同级关系,我序紧靠一起
示例:#food~div
#many p.special~p
匹配到多个结果:与#many p.special元素同级的p元素
属性选择器(重要)
使用场景
选择具有某个属性(值)的元素
表示方法
*[属性=“属性值”]
*表示任意元素标签名,如p,div,li,button等
通常属性值没有空格或特殊字符,可以不加引号
实例:
[style] 具有style属性的任意元素
p[spec=len2] 属性spec = len2 的p元素
p[spec="len2 len3"] 属性spec=‘len2 len3’的p元素,len2 len3之间存在空格所以加引号
p[spec='len2'] 属性spec包含len2的p元素
p[spec^='len2'] 属性spec以len2开头的p
p[spec$='len2'] 属性spec以len2结尾的p
p[class=special][name=p1] #属性class=special并且属性name=p1的p
#many p[name=p1] 与后代选择器组合
#food>span+p[class=vegetable] 与兄弟选择器组合
组选择器
使用场景
当一组选择器无法选择我们需要的元素,可以通过多组选择器来选择元素
,
与表示两组不同的css选择器
实例:
div,span.p
同时选择所有div,span.p元素
扩展
#food > span,p 表示选择ID为food的所有span子元素和所有的p
#food >span,#food>p
表示选择id为food的span子元素和p子元素
伪类nth-child,nth-of-type:
使用场景
根据下标选择子元素,下标从1开始
表示方法:
:nth-child(n) #从中选择第n个元素,且表示的元素必须位于父元素的第n位
:nth-of-type(n) #从中选择第n个元素,对表示的元素处于第几位没有要求
n>1
表示一组选择器
示例:
p:nth-child(3)
选择其父元素下的第三个元素,元素类型必须是p
p:nth-of-type(3)
选择其父元素下的第三个p类型的元素,对于p元素位置没有要求
扩展
#food > span:nth-child(2)
选择#food元素下第二个元素,该元素必须是span
#food > p:nth-of-type(2)
选择#food元素下第二个p元素,无论位置在哪
编辑框操作
清空输入框
input_ele.clear()
获取输入框已经输入的文本
input_ele.get_attribult('value')
Tips:input_ele 是input对应的webelement对象
ele = driver.find_element_by_id('input1')
eles = driver.find_element_by_id('ta1')
ele.send_keys('fds')
ele.clear()
ele.send_keys('fdsfsafadsafdsa')
print(ele.get_attribute('value'))
eles.send_keys('131313')
print(eles.get_attribute('value'))
单选框
image.png
单选框有什么特点?
只能单选,不管原来该元素是否选中,直接去点击该元素即可,都可以确保该单选框被选中。
操作:
只要调用click就可以
gender = driver.find_element_by_css_selector('[value="male"]')
female = driver.find_element_by_css_selector('[value="female"]')
other = driver.find_element_by_css_selector('[value="other"]')
#判断是否被选中
print(gender.is_selected())
print(female.is_selected())
gender.click()
female.click()
other.click()
print(other.is_selected())
time.sleep(5)
driver.quit()
勾选框操作
什么是勾选框
image.png
勾选框有什么特点?
可以多选,点击被选中的元素则会取消选中状态,反之亦然
如何操作
通过is_selected()查看元素是否处于选中状态
调用click()进行选择
car = driver.find_element_by_css_selector('[value="car"]')
plan = driver.find_element_by_css_selector('[value="plane"]')
if not car.is_selected():
car.click()
if not plan.is_selected():
plan.click()
time.sleep(3)
复选框操作
有两种:
image.png
特点都是下拉框类型的元素
第一种可以通过ctrl+点击选择多个元素
第二种只能选择一个元素,且必须选择一个元素
如何操作:
将元素用select类包装一下
模拟选择(两种下拉框都通用):调用select _by_visible_text(),参数是option元素的文本值。
取消选择(仅限第一种选择框):deselect_by_visble_text()
取消所有选择(仅限第一种选择框):deselect_all()
sele = Select(driver.find_element_by_id('multi'))
sele.select_by_index(0)
sele.select_by_value('benz')
time.sleep(5)
sele.deselect_by_visible_text('奥迪A6')
time.sleep(3)
#取消所有选择
sele.deselect_all()
xialakuang = Select(driver.find_element_by_id('single'))
# xialakuang.select_by_value('female')
# xialakuang.select_by_index(1)
xialakuang.select_by_visible_text('男')
xialakuang.deselect_all()
time.sleep(2)