Selenium学习之==>Css Selector使用方法

一、什么是Css Selector

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

工具

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

二、Css Selector使用方法

1、通过ID、Class定位

1 ID定位
2 #号代表id,定位有id的标签方式更加简洁
3 #i1
4 
5 Class定位
6 .代表Class
7 .c1
8 Class定位还提供了多个Class定位,通过连续.来缩小范围
9 .c1.c2.c3

2、通过标签定位

1 定位方式 :直接输入标签名称
2 div
3 input
4 单独用没什么作用,因为一个页面相同的标签太多了,需要和其他方式组合起来用

3、通过属性定位

1 属性定位方式,直接中括号,加上属性就可以了 
2     [name='n1']

4、通过标签属性组合定位

1 标签属性组合
2 input[name='n1']
3 
4 标签与Class组合
5 input.c1
6 
7 标签与ID组合
8 input#i1

5、通过多属性组合

1 Css Selector 的多属性组合选择过滤 没有and 只需要多个[] 连接 就可以
2 select[name='city'][size='4'][multiple="multiple"]

6、通过层级关系定位

1 与Xpath的不同 Css Selector通过 > 来区分层级的界定
2 select>option[value='3']

7、模糊匹配

1 ^= 匹配元素属性以什么开头
2 [placeholder^='请输入']
3 
4 $= 匹配属性以什么结尾
5 [placeholder$='元素']
6 
7 *= 匹配属性包含什么值 input
8 [placeholder*='ID']