首页 > 代码库 > 自动化测试selenium----css选择器总结

自动化测试selenium----css选择器总结

2024-08-27 22:22:32   210人阅读

 
选择器 示例 描述
* * 匹配任何元素
element DIV 标签选择器，匹配所有使用DIV标签的元素
.class .tips class选择器，匹配所有class属性中包含info的元素  .a.b则匹配同时包含a和b的元素
#id #username id选择器，匹配id属性为username的元素
element，element DIV,SPAN 多元素选择器，选择所有DIV和SPAN全集，使用,分隔
element element DIV SPAN 后代元选择器，匹配所有的DIV的SPAN后代元素，中间使用空格分隔
elemen> telement DIV>SPAN 子元素选择器，匹配所有的DIV的SPAN子元素，中间使用> 分隔
elemen+ telement DIV+SPAN 毗邻元素选择器，匹配紧随DIV后面的同级SPAN元素（only one），不一定就是一个同一个div后面的一个
elemen~ telement DIV~SPAN 同级元素选择器，匹配所有DIV后面的同级SPAN元素，可以隔着其他元素
[attribute] [att] 所有包含att属性的元素
[attribute=vlaue]
DIV [att=‘val‘]
 匹配所有att属性为val的DIV元素 
[attribute^=vlaue]
[attribute|=vlaue]
 DIV[att^=‘val‘] 匹配所有att属性以val开头的DIV元素 w3s使用的是|
[attribute$=vlaue] DIV[att$=‘val‘] 匹配所有att属性以val结尾的DIV元素
[attribute*=vlaue]
[attribute~=vlaue]
 DIV[att*=‘val‘] 匹配所有att属性包含val的DIV元素
[attr1=vla1][attr2*=vla2]
DIV [att1=‘v1‘][att2*=‘v2‘]
匹配所有att属性为v1，att2属性包含v2的DIV元素
 
 
[attr1=vla1]，[attr2*=vla2] DIV [att1=‘v1‘]，[att2*=‘v2‘] 同上  或关系
:link a:link 选择所有未被访问的链接  
:visited a:visited 选择所有已被访问的链接  
:active a:active 选择所有活动链接  
:hover a:hover 选择鼠标指针所在的链接  
:focus input:focus 选择获取焦点的input元素 
:first-child
p:first-child
 选择所有符合如下规则的p元素，p必须是其父元素的第一个子元素
:last-child
p:last-child
 选择所有符合如下规则的p元素，p必须是其父元素的最后一个子元素
:first-of-type
p:first-of-type
 选择父元素的首个p子元素的集合，和first-child区别是前面可以有非p元素，不一定是父元素的第一个子元素
:last-of-type
p:last-of-type
 选择父元素的首最后一个p子元素的集合，和last-child区别是后面可以有非p元素，不一定是父元素的最后一个子元素
:only-of-type
p:only-of-type
 选择父元素的只有唯一个p子元素的集合
:nth-child(n)
p:nth-child(2)
选择属于其父元素的第二个子元素的每个 <p> 元素
:nth-last-child(n)
p:nth-last-child(2)
 同上，从最后一个元素来计数
:nth-of-type(n)
p:nth-of-type(2)
 选择父元素的第二个p子元素的集合，和:nth-child(n) 区别是前后可以有非p元素，不一定是父元素的第二个子元素
:nth-last-of-type(n)
p:nth-last-of-type(2)
 同上，从最后一个元素来计数
:root
:root
 选择文档的根元素
:empty
p:empty
 选择没有子节点的p元素包含文本节点
:enabled
input:enabled
 选择每个启用的input元素
:disabled
input:disabled
 选择每个禁用的input元素
:checked
input:checked
 选择每个被选中的input元素
:not(selector)
:not(p)
选择所有非p元素
Selenium 中则是采用 了来自Sizzle 的css3 定位扩展，它的语法更加灵活易懂。
:nth(n)
:eq(n)
li:nth(2)
li:eq(2)
 同:nth-child(n)，但是从0开始
:first li:first 同:first-child
 :last li:last 同:last-child
:even li:even 在其父元素中的li 子元素集合中排在偶数位的集合
:odd li:odd 在其父元素中的li 子元素集合中排在奇数位的集合
:lt(n) li:lt(2) 在其父元素中的li 子元素集合中排在第n位之前的所有元素集合（不包含n），n从0开始
:gt(n) lg:lt(2) 在其父元素中的li 子元素集合中排在第n位之后的所有元素集合（不包含n），n从0开始
:only-child div:only-child 同:only-of-type
:empty p:empty 同CSS原生选择器:empty
:input :input 获取所有input类型的元素（包含input、select、textarea）
:text, :checkbox, :file, :password, :submit, :image, :reset, :button ... 获取指定类型的元素
 
 

自动化测试selenium----css选择器总结


联系
我们