1、Xpath定位
表达式 | 描述 |
---|
/ | 根节点 |
/ / | 相对路径 |
. | 当前路径 |
.. | 返回上层 |
@ | 选取属性 |
实例:
html/head/div
/html/div/
//div
//div/./..
//div[@name] 根据属性名定位
//div[@name='taoge'] 根据属性名和属性值定位
//div[@name='taoge']/div[1] 定位第1个
//div[@name='taoge']/div[last()] 定位最后一个
//div[@name='taoge']/div[last()-1] 定位倒数第2个
//div[@name='taoge']/div[position()=5] 定位第5个
//div[@name='taoge']/div[position()>=5] 定位到大于等于第5个的
//span[i=1000] 根据标签内的值定位如:<i>1000</i>
//span[i>1000]
通配符
通配符 | 描述 |
---|
* | 匹配任何元素节点 |
@* | 匹配任何属性节点 |
node() | 匹配任何类型的节点 |
//* 定位所有节点
/* 定位最外层节点
//tital[@*] 定位所有带有tital的节点元素
//*[@*] 定位所有标签中有属性的如: <link href="www.baidu.com"></link> 不是:<i></i>
//html/node() 只定位html的子标签一层,node()只代表任意一个节点
//html/node()/meta 与 //html/*/meta 定位的一样
//meta | //link 定位meta或者link节点放到一个集合中
(//textarea | //div)[@id='wrapper']
//*[text()='taoge'] 定位标签之间的文本内容如:<i>taoge</i>
//*[starts-with(@name,"abc")] 定位属性name的值以abc开头的节点如:<div name="abcdefgh"></div>
//*[contains(@name,"cde")] 定位属性name的值包含abc的节点如:<div name="abcdefgh"></div>
//*[@name='taoge' and @class='xiaohong'] 用户两个属性和值来定位节点
2、CSS选择器(优先使用)
.taoge 用类名来定位节点如:<div class="taoge"></div>
#taoge 用id名来定位节点如:<div id="taoge"></div>
* 定位所有节点
div 用标签节点p来定位如:<div></div>
div,link 定位div或者link节点放到一个集合中
div a 定位到div节点下所有的a节点,包括子节点、孙节点、重孙节点
div>a 只定位到div节点下子节点a
div+link 定位到div节点下面的link节点,div和link是同胞节点
[id] 定位到所有id属性的标签
[id='taoge'] 用id名来定位节点如:<div id="taoge"></div>
[class] 定位到所有class属性的标签
[class='taoge'] 用class名来定位节点如:<div class="taoge"></div>
[class~='taoge'] 用class名中包含taoge来定位节点如:<div class="taoge xiaohong"></div>
[type] 定位到所有type属性的标签 <div type="taoge"></div>
[type='taoge'] 用type属性值来定位节点如:<div type="taoge"></div>
[name|='taoge'] 定位name属性值以taoge开头如:<div name="taoge-ceshi"></div>
div[src^="http:"] 定位src属性值前缀是http:的如:<div src="http://www.taoge.js"><div>
div[src$="js"] 定位src属性值后缀是js的如:<div src="http://www.taoge.js"><div>
div[src*="taoge"] 定位src属性值包含taoge的如:<div src="http://www.taoge.js"><div>
p:only-child 定位子节点只有p节点
div:only-child 定位子节点只有div节点
div>p:nth-child(2) 定位div的第二个子节点p
div>a:nth-child(2) 定位div的第二个子节点a
div>*:nth-last-child(3) 定位div的倒数第三个节点
:empty 定位所有没有子节点的节点
div:empty 定位所有没有子节点的div节点
#taoge:target 定位当前活动的#taoge节点
input:enabled 定位所有开启的input节点
input:disabled 定位所有禁用的input节点
input:checked 定位所有选中的input节点
:not(p) 定位所有不是p的节点
a.taoge:nth-child(2) 定位所有a节点包含类名taoge的第二个节点如:
<a class="xiaolv"></a>
<a class="taoge"></a>
<a class="xiaolan"></a>