UI自动化（九）Css Selector
什么是Css Selector？
Css Selector定位实际就是HTML的Css选择器的标签定位
工具
Css Selector的练习建议大家安装火狐浏览器后，下载插件，FireFinder 或 FireBug和FirePath组合使用。
Css Selector使用方法
1、Css Selector支持ID、Class的定位 与HTML中CSS定位相同
|
1
2
3
4
5
6
7
8
9
10
11
|
# 号表id 定位有id的标签方式更加简洁
#i1
. 代表Class 定位有id的标签方式更加简洁
.c1
Class定位还提供了多个Class定位 通过连续 . 来缩小范围
.c1.c2.c3
|
2、Css Selector支持标签定位没什么卵用
|
1
2
3
|
与Css相同 支持标签选择器，但并没有什么用，一个页面重复的标签太多
定位方式 ：直接输入标签名称
|
3、Css Selector支持任意属性定位
|
1
2
3
|
属性定位方式与css相同,直接中括号，加上属性就可以了
[name='n1']
|
4、单单属性定位不足以满足我们的定位需求，Css Selector提供了标签属性组合定位
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
与css 定位相同 等同于我们标签属性选择器
input[name='n1']
当与ID、Class 组合使用时书写方式更为简单
Class
input.c1
ID
input#i1
|
5、Css Selector提供了多属性组合过滤
|
1
2
3
|
Css Selector 的多属性组合选择过滤 没有and 只需要多个[] 连接 就可以
select[name='city'][size='4'][multiple="multiple"]
|
6、同样Css Selector也支持层级关系定位
|
1
2
3
|
与Xpath的不同 Css Selector通过 > 来区分层级的界定
select>option[value='3']
|
7、Css Selector模糊匹配
|
1
2
3
4
5
6
7
8
9
10
11
|
^= 匹配元素属性以什么开头
input[value^="登"]
$= 匹配属性以什么结尾
input[value$="录"]
*= 匹配属性包含什么值 input
[value*="录"]
|
倚天剑我们已经是不是比屠龙刀更加的锋利？
毕竟倚天剑和屠龙刀不是一般人能够使用的，如果屠龙刀与倚天剑挥舞不起来，还有个简单的神器，Selenium Builder。
