Python + Selenium —— 网页元素定位之Xpath定位！_python 浏览器上级节点

遇到某些元素无法精确定位的时候，可以查找其父级及其祖先节点，找到有确定的祖先节点后通过层级依次向下定位。

以下面的结构为例：

<form action="search" id="form" method="post">
    <span class="bg">
        <span class="soutu">搜索</span>
    </span>
    <span class="soutu">
        <input type="text" name="key" id="su">
    </span>
</form>

1. 根据层级向下找，从 form 找到绿色的 span：

//form[@id="form"]/span/span

1. 查找某元素内部的所有元素，选取 form 元素内部的所有 span：

//form[@id="form"]//span

第二个双斜杠，表示选取内部所有的 span，不管层级关系

1. 使用星号找不特定的元素

//*[@id="form"]//*[@type="text"]

选取 id 属性为 form 的任意属性内部，并且 type 属性为 text 的任意元素。这里会找到 input。

1. 使用..从下往上找，根据 input 查找其父节点 span：

//input[@name="key"]/..

注意最后的两个点，找到 input 节点的上级节点，如果还要再往上再加 /..

1. 找同级节点：
   比如我们想通过第一个 span 标签去 找 div 标签。树形结构中，兄弟节点之间的关系是通过父节点建立起来的。所以可以先找到父节点，再通过父节点找同级节点。

//span[@class="bg"]/../div

先通过/..找到 span 的父节点，再通过父节点找到 div。

使用谓语定位

谓语是 Xpath 中用于描述元素位置。主要有数字下标、最后一个子元素last()、元素下标函数position()。

1. 使用下标的方式，从 form 找到 input ：

//form[@id="form"]/span[2]/input

Xpath 中的下标从 1 开始。

1. 查找最后一个子元素，选取 form 下的最后一个 span：

//form[@id="form"]/span[last()]

1. 查找倒数第几个子元素，选取 form 下的倒数第一个 span：

//form[@id="form"]/span[last()-1]

1. 使用 position() 函数，选取 from 下第二个 span：

//form[@id="form"]/span[position()=2]

1. 使用 position() 函数，选取下标大于 2 的 span：

//form[@id="form"]/span[position()>2]

使用逻辑运算符

如果元素的某个属性无法精确定位到这个元素，我们还可以用逻辑运算符 and 连接多个属性进行定位，以百度输入框为例。

1. 使用 and ：

//*[@name='wd' and @class='s_ipt']

查找 name 属性为 wd 并且 class 属性为 s_ipt 的任意元素

1. 使用 or：

//*[@name='wd' or @class='s_ipt']

查找 name 属性为 wd 或者 class 属性为 s_ipt 的任意元素，取其中之一满足即可。

1. 使用|，同时查找多个路径，取或：

//form[@id="form"]//span | //form[@id="form"]//input

选取 form 下所有的 span 和所有的 input。

使用文本定位

使用文本定位，是 Xpath 中的一大特色。在自动化测试中，为了让代码的可读性更高，可以使用文本的方式。
以下一个案例：

部分网页结构如下：

<tr>
  <td valign="top">
    <input type="radio" name="payment" value="1" checked="" iscod="0">
  </td>
  <td valign="top">
    <strong>支付宝</strong>
  </td>
</tr>

其实我们需要点的是前的单选框，但是单选框没有任何特殊的标识，不够灵活。我们可以通过后面的名称，如(支付宝、余额支付等)来找到其对应行的 radio，再去点击。

我们就需要先通过文本定位到“支付宝”，再去找其同一行(tr)的 input 节点。如果理不清楚，我们可以先画一个结构图：

红色箭头表示查找路径，先定位到“支付宝”所在的 strong，再定位 td -> tr -> td - >input 。那么要定位“支付宝”文本，就需要用到 Xpath 中的函数 text() 或 string()，注意是函数，所以括号不能少。

text()：当前元素节点包含的文本内容；
表达式//div[text()="文本"]，能找到：

<div>文本</div>

• 1

不能找到：

<div><span>文本</span></div>

• 1

string()：当前元素节点内部所有节点元素的文本内容。表达式//div[string()="文本"]上述两种情况都能找到。

好，接着写上面的内容。先通过 //strong[text()="支付宝"]定位到“支付宝”所在的元素 strong，再找上级 td -> tr，再向下找：

//strong[text()="支付宝"]/../../td[1]/input

也可以写为：

//td[string()="支付宝"]/../td[1]/input

使用部分匹配函数

Xpath 中有提供了几个函数，用来进行部分匹配。

函数	说明	举例
contains	选取属性或者文本包含某些字符	//div[contains(@id, ‘data’)] 选取 id 属性包含 data 的 div 元素 //div[contains(string(), ‘支付宝’)] 选取内部文本包含“支付宝”的 div 元素
starts-with	选取属性或者文本以某些字符开头	//div[starts-with(@id, ‘data’)] 选取 id 属性以 data 开头的 div 元素 //div[starts-with(string(), ‘银联’)] 选取内部文本以“银联”开头的 div 元素
ends-with	选取属性或者文本以某些字符开头	//div[ends-with(@id, ‘require’)] 选取 id 属性以 require 结尾的 div 元素 //div[ends-with(string(), ‘支付’)] 选取内部文本以“支付”结尾的 div 元素

验证 Xpath

验证 xpath 有两种方法：

1. 在开发者工具的 Elements 中按Ctrl + F，在搜索框中输入 Xpath：

1. 在开发者工具的 Console 中使用 $x()

下面是配套资料，对于做【软件测试】的朋友来说应该是最全面最完整的备战仓库，这个仓库也陪伴我走过了最艰难的路程，希望也能帮助到你！

最后： 可以在公众号：自动化测试老司机 ！ 免费领取一份216页软件测试工程师面试宝典文档资料。以及相对应的视频学习教程免费分享！，其中包括了有基础知识、Linux必备、Shell、互联网程序原理、Mysql数据库、抓包工具专题、接口测试工具、测试进阶-Python编程、Web自动化测试、APP自动化测试、接口自动化测试、测试高级持续集成、测试架构开发测试框架、性能测试、安全测试等。

如果我的博客对你有帮助、如果你喜欢我的博客内容，请 “点赞” “评论” “收藏” 一键三连哦！

一、Python所有方向的学习路线

Python所有方向的技术点做的整理，形成各个领域的知识点汇总，它的用处就在于，你可以按照下面的知识点去找对应的学习资源，保证自己学得较为全面。

二、Python必备开发工具

工具都帮大家整理好了，安装就可直接上手！

三、最新Python学习笔记

当我学到一定基础，有自己的理解能力的时候，会去阅读一些前辈整理的书籍或者手写的笔记资料，这些笔记详细记载了他们对一些技术点的理解，这些理解是比较独到，可以学到不一样的思路。

四、Python视频合集

观看全面零基础学习视频，看视频学习是最快捷也是最有效果的方式，跟着视频中老师的思路，从基础到深入，还是很容易入门的。

五、实战案例

纸上得来终觉浅，要学会跟着视频一起敲，要动手实操，才能将自己的所学运用到实际当中去，这时候可以搞点实战案例来学习。

六、面试宝典

简历模板

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化学习资料的朋友，可以戳这里无偿获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！