Selenium----css selector的使用

css selector
　　css selector定位实际上就是HTML的css选择器的标签定位

借助工具
　　css selector定位需要借助火狐浏览器并下载插件Firebug和Firepath

css selenium定位方法
1、属性定位
　　1.css可以通过元素的id、class、标签这三个常规属性直接定位

　　　　# 代表id，定位有id的标签，如：#username

　　　　.代表class，定位有class的标签，如：.inner
　　　　class定位还提供了多个class定位，通过连续.来缩小范围，如：.inner1.inner2.inner3

2、任意属性定位
　　属性定位，直接中括号，加上属性就可以了，如：[name='username']

3、标签属性组合定位
　　input[name='n1']，先定位到input标签，再在input标签中定位name=n1的元素
　　当与id，class组合使用时书写更简洁，如：
　　　　　　　　　　　　　　　　　　　　与class组合为：input.c1
　　　　　　　　　　　　　　　　　　　　与id组合为：input#n1

4、多属性组合定位
　　css selector的多属性组合定位，只需要多个[]链接就可以，如：[type='text'][id='i1']

5、层级关系定位
　　与xpath不同，css selector通过>来区分层级的界定，如：div.driver>#i1

6、模糊匹配
　　^= 代表要匹配是以什么开头的元素，如：input[placeholder^='请输入']
　　$=代表要匹配是以什么结尾的元素，如：input[placeholder$='元素']
　　*=代表要匹配是包含什么的元素，如：input[placeholder*='元']

 7、支持索引
css也可以通过索引div：nth-child(1)来定位子元素，如下：
①. 选择第一个子元素driver.find_element(By.CSS_SELECTOR,"#nr>div:nth-child(1)")
②. 选择第二个子元素driver.find_element(By.CSS_SELECTOR,"#nr>div:nth-child(2)")
③. 选择第三个子元素driver.find_element(By.CSS_SELECTOR,"#nr>div:nth-child(3)")