前言
无论是玩爬虫, 还是自动化测试, 元素定位少不了
虽然CSS选择器效率更佳, 但天生不具备文字定位功能
加上前端编码不规范, 前端技术的革新(如vue), 好些css属性开始淡化, 可能通篇就一个id='app'
所以本人更倾向于xpath
- 文字更直观, 更容易理解定位的对象
- 前端组件化后, xpath可以更通用, 比如表单中的输入控件, 下拉框等
xpath文字定位
1. text() - 匹配文字
像div[@id='app']
这类属性定位大家应该很熟悉了, 就不赘述
下面截取豆瓣电影部分页面源码
导演/编剧的结构一样, 用xpath定位如下:
//span[text()='导演']
//span[text()='编剧']
2. 同级元素
如果要获取导演的具体信息, 可以结合following-sibling, 如果是同级往上,则使用preceding-sibling
following-sibling
Indicates all the nodes that have the same parent as the context node and appear after the context node in the source document.
preceding-sibling
Indicates all the nodes that have the same parent as the context node and appear before the context node in the source document.
//span[text()='导演']/following-sibling::span/a
//span[text()='编剧']/following-sibling::span/a
试想, 如果类似的属性都是相同结构, 只需要将文字作为参数, 就能定位到指定的数据
3. contains() - 文字包含
contains方法放宽文字匹配规则, 部分匹配即可, 更加灵活
4. normalize-space() - 去除空格
有时, 文字的前后有空格, 或者回车, 可以使用normalize-space方法去除
The normalize-space function strips leading and trailing white-space
from a string, replaces sequences of whitespace characters by a single
space, and returns the resulting string.
网友评论