html 标签样例
<div class="a">
<div class="b c">
<div></div>
<a>helloworld</a>
<div></div>
</div>
</div>
基本规则
/
表示一个层级关系,//
表示多个层级关系@
表示 html 标签的属性,比如@class
[]
中可以写匹配上的具体属性等信息[数字]
可以表示所有匹配到的元素中第几个,[last()]
表示最后一个,[last()-1]
表示倒数第二个
支持使用()
,表示先看成一个整体*
表示任意 html 标签,比如说使用//*
支持and
连接,如 contains() 函数包含某个且另一个 contains() 包含什么/..
支持定位上一层级
我想匹配到 a 标签
//div[@class='a']/div/a
查找第几个
xpath 匹配默认匹配第一个
现在假如可以匹配多个,我想查找最后一个
(//div/div/a)[last()]
假如我要查找倒数第二个
(//div/div/a)[last()-1]
查找第二个
(//div/div/a)[2]
依据文本查找
依据文本精确匹配
//a[text()='helloworld']
依据文本部分匹配
//a[contains(text(), 'hello')]
如果 a 标签中不是纯文本,而是有一些其他乱七八糟的元素包裹,然后再是中文呢,可以使用 string() 将 a 标签中所有的东西都替换成字符串
//a[contains(string(), 'hello')]
多个 class 如何定位
常见的比如说 class 属性有多个,比如上面的例子中第二个 div 中既有 b class 又有 c class
//div/div[contains(@class, 'c')]/a
定位同层级相邻元素
先说明一些/..
的形式表示定位到上一层级
假如我现在想定位到 a 标签同层的上面那个 div
//a[text()='helloworld']/preceding-sibling::div[1]
这个数字 1 表示紧紧相邻的上面的第一个
假如我现在想定位到 a 标签同层的下面的那个 div
//a[text()='helloworld']/following-sibling::div[1]
数字 1 同理
xpath 定位技巧掌握上面的 xpath 定位方法已经足够我们工作的时候用了,若工作中还是碰到了一些非常偏的定位元素,那就只得临时去百度搜一下了O(∩_∩)O哈哈~
下面介绍一些自己在 xpath 定位上的心得:
- 能使用 id 识别直接使用 id,因为 id 唯一
- 除了 id,name 属性也是一个很好的选择
- class 也行,但是 class 是有很多重复的,使用 class 注意标签元素以及层级关系,尽量使用一个与页面结构一致的层级关系,这种层级关系能够让你在页面上也很容易去识别
- 尽量少使用文本去定位,因为文本的变动性太强
- 尽量少用第几个这样的方式定位,因为页面变动,xpath 也不稳定