工具
在chrome浏览中,在chropath中选择Selectors选项,就可以使用CSS-Selector进行定位了
Css Selector使用方法
1、支持class、id定位,和CSS中选择器一样
# 号表id 定位有id的标签方式更加简洁 #i1 . 代表Class 定位有id的标签方式更加简洁 .c1 Class定位还提供了多个Class定位 通过连续 . 来缩小范围 .c1.c2.c3
2、支持标签定位
支持标签定位,但是一般页面标签重复的很多,一般可用来缩小查找范围 查找input标签下class='classname'元素 input.classname 查找input标签下id='i1' input#i1
3、支持属性定位
属性定位方式与css相同,直接中括号,加上属性就可以了 [name='n1'] input[name='n1']
4、单单属性定位不足以满足我们的定位需求,可以使用标签+属性,标签+class/id定位
input[name='n1'] input.classname input#i1
5、Css Selector也支持层级关系定位
与Xpath的不同 Css Selector通过 > 来区分层级的界定 select>option[value='3']
6、支持多属性定位
Css Selector 的多属性组合选择过滤 没有and 只需要多个[] 连接 就可以 select[name='city'][size='4'][multiple="multiple"]
7、Css Selector模糊匹配
^= 匹配元素属性以什么开头 input[value^="登"] $= 匹配属性以什么结尾 input[value$="录"] *= 匹配属性包含什么值 input [value*="录"]