一、哪些情况不能用ID选择器
・元素的ID不唯一，或者ID是动态变化的
・name以及linktext属性值不唯一
如果满足上述条件，则不能用ID选择器来定位元素，就需要依靠xpath或CSS来定位元素了
PS：不管使用什么方式来查找元素（比如id、name、xpath、CSS等），都需要确保页面上查找出来的元素的唯一性，应该只找到一个匹配的node（如何查看是否唯一，在前两篇已经详细说过——方式二如何查看匹配节点）
二、CSS选择器语法
tag[attribute=‘value’]
标签名[属性=‘值’]
在CSS里，#代表ID，.代表class
★ID选择器查找元素
举个栗子
我们写一下慕课网登录的CSS定位，有三种写法
1）按语法规则输入：a[id=‘js-signin-btn’]，可以看到黄色高亮显示，说明CSS选择器是可以用的，显示一个匹配的节点
ID选择器查找元素1
2）在CSS语法中，#代表id，所以我们查找的属性时id的话，可以忽略语法，使用简写：#js-signin-btn，可以看到DOM里也是黄色背景高亮
ID选择器查找元素2
3）最后一种写法：a#js-signin-btn,把标签的名字加在了最前面，什么情况写需要加标签呢？如果这个页面有多个标签都有同一个id（一般不会出现这种情况），这种情况下，加上标签名，直接会查找到某个标签下的id,可以使搜索速度更快
ID选择器查找元素3
★class选择器查找元素
举个栗子
我们写一下慕课网购物车的CSS定位
1）按语法规则输入：span[class=‘icon-shopping-cart’]，只输入了一个class，但是没有查找到元素；为什么呢？是因为在单引号里class要完全匹配
class选择器查找元素1-1
现在改一下class值，输入完整的class：span[class=‘icon-shopping-cart js-endcart’]，查找出来唯一的元素
class选择器查找元素1-2
2）购物车元素的class有两个，我们先写icon-shopping-cart，使用.代替class，使用简写：.icon-shopping-cart，可以看到查找出三个元素，此时查找的元素是不唯一的，运行时会报错
class选择器查找元素2
3）写js-endcart，输入.js-endcart，查找出来一个元素，是唯一的
class选择器查找元素3
4）加上标签名，可以看到元素是在span这个标签里的，所以输入span.js-endcart，查找出来一个元素，是唯一的
class选择器查找元素4-1
追加class(.class1.class2.class3—)直到找到唯一的元素
输入.icon-shopping-cart.js-endcart
class选择器查找元素4-2
★通配符定位
语法：标签【属性 通配符=‘值’】
“^”代表以什么文本开始
“$”代表以什么文本结束
“*”代表包含什么文本
1）输入div[class^=‘search’],可以查找到div标签下所有以search开头的class属性的元素
通配符定位1
2）输入div[class$=‘area’],可以查找到div标签下所有以area结尾的class属性的元素
通配符定位2
3）标签名[属性名=属性值]，如：find_element_by_css_selector("input[autocomplete='off']")
输入a[title*=‘页’],可以查找到a标签下所有包含页的title属性的元素
通配符定位3
★查找子节点
：通过找到父节点标签来定位子标签，不包括孙标签
父节点>.class属性值（id属性用#）
查找子节点
・逗号，代表谁和谁
逗号，代表谁和谁
・空格，代表所有的后代标签
空格，代表所有的后代标签
💛属性中带空格怎么筛选？
xpath中class带空格直接写空格，css中用.点代替
属性中带空格的筛选
三、Xpath定位方式
★xpath语法
语法：//tag[@attibute=‘value’]
★绝对路径
xpath绝对路径用单斜线“/”表示
★相对路径
xpath 相对路径用双斜线“//”表示
★“/”和“//”的区别
“/”：元素是上一级节点的子节点中的一个，不能跳级
“//”：下级任何子节点或者任何嵌套子节点中的一个，可以跳级
路径里不能用“*”，要写标签名
★用元素的text文本属性
语法：//a[text()=‘忘记密码’]
用元素的text文本属性
★用contains关键字构建有效的xpath
语法：//tag[contains(attribute,‘value’)]
用[contains]
★starts-with关键字构建有效的xpath
语法：//tag[starts-with(attribute,‘value’)]
starts-with关键字
★ends-with
匹配以xx结尾的属性值
例如：
//input[ends-with(@class,"-special")]
★使用逻辑运算符--and , or
例如：
//input[@name="phone" and @datatype="m"]
★如何查找父节点和平级节点
父节点：xpath-to-some-element//parent::<标签名>
前面平级节点：xpath-to-some-element//preceding-sibing::<标签名>
后面平级节点：xpath-to-some-element//followinging-sibing::<标签名>
四、
CSS和xpath定位不同的是，标签名前不用// ，[ ]内的属性名前不用@符号，而xpath则需要。其余的规则与xpath相同
——————————————————————————————
版权声明：本文为CSDN博主「Lefdr」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/LSMSMD0526/article/details/118971176
https://blog.csdn.net/LSMSMD0526/article/details/119065078
网友评论