Selenium彩蛋篇-Css Selector使用方法

什么是Css Selector？

Css Selector定位实际就是HTML的Css选择器的标签定位

工具

Css Selector的练习建议大家安装火狐浏览器后，下载插件，FireFinder 或 FireBug和FirePath组合使用。

Css Selector使用方法

1、Css Selector支持ID、Class的定位 与HTML中CSS定位相同

 

# 号表id 定位有id的标签方式更加简洁

 #i1

 

. 代表Class 定位有id的标签方式更加简洁

 .c1

 

Class定位还提供了多个Class定位 通过连续 . 来缩小范围

 .c1.c2.c3

 

2、Css Selector支持标签定位没什么卵用

 

与Css相同 支持标签选择器，但并没有什么用，一个页面重复的标签太多

 

定位方式 ：直接输入标签名称

 

3、Css Selector支持任意属性定位

 

属性定位方式与css相同,直接中括号，加上属性就可以了

 

[name='n1']

 

4、单单属性定位不足以满足我们的定位需求，Css Selector提供了标签属性组合定位

 

与css 定位相同 等同于我们标签属性选择器

 

input[name='n1']

 

当与ID、Class 组合使用时书写方式更为简单

 

Class

 

input.c1

 

ID

 

input#i1

 

5、Css Selector提供了多属性组合过滤

 

Css Selector 的多属性组合选择过滤 没有and 只需要多个[] 连接 就可以

 

select[name='city'][size='4'][multiple="multiple"]

 

6、同样Css Selector也支持层级关系定位

 

与Xpath的不同 Css Selector通过 > 来区分层级的界定

 

select>option[value='3']

 

7、Css Selector模糊匹配

 

^= 匹配元素属性以什么开头

 

input[value^="登"]

 

$= 匹配属性以什么结尾

 

input[value$="录"]  

 

*= 匹配属性包含什么值 input

 

[value*="录"]