xpath元素定位


前言

自动化测试就是模拟人的操作,对页面的元素进行点、勾选、输入,等操作。前提是只有我们找到了对的元素,才能进行这一系列动作。xpath就是一种比较常用的找元素的方法。


提示:以下是本篇文章正文内容,下面案例可供参考

xpath

提示:是一种基于页面元素的路径和层级来定位元素的语言,有绝对路径和相对路径之分,一般情况下用相对路径即可,书写起来方便。
绝对路径:从html页面的根路径下一层一层的往下查找元素
相对路径:从筛选条件和条件对应的值来查找元素
//表示从根路径下开始查找元素
*表示任意元素,也可以是元素名称
[]表示筛选条件
@表示基于属性来筛选
text()表示基于元素的文本内容来定位元素

1.通过元素的属性和属性值来定位元素

举一个最简单的例子

  1. 谷歌浏览器访问百度页面,按F12打开开发者模式,在开发者模式页面上点击右上角三个点,点击最左边,让开发者模式页面侧停靠至单独页面。点击元素,点击小鼠标,选中页面中的输入框。
    在这里插入图片描述

  2. 选中输入框后,对应F12页面中有一行代码底色会变黑,点击该行前面的三个点。
    在这里插入图片描述

  3. 点击复制XPath便可以得到这个元素的xpath语句。
    在这里插入图片描述

  4. 按Ctrl+F弹出下面的输入框,黏贴刚刚的xpath语句,便可以定位刚刚的元素,可以看到这个元素只有一个。
    在这里插入图片描述

1.1基于id来查找元素

语法:

//*[@id="kw"]

解释:查找根路径下任意元素中id为‘kw’的元素
在这里插入图片描述

1.2基于name来查找元素

语法:

//input[@name="wd"]

解释:查找根路径下input元素中name为‘wd’的元素
在这里插入图片描述

1.3基于多个属性来查找元素

语法:

//*[@class="mnav c-font-normal c-color-t" and @href="http://image.baidu.com/"]

解释:查找根路径下任意元素中class为’mnav c-font-normal c-color-t’且href为’http://image.baidu.com/‘的元素
在这里插入图片描述

2通过元素的文本值来定位元素

语法:

//*[text()="按图片搜索"]

解释:查找根路径下任意元素中文本内容为‘按图片搜索’的元素
在这里插入图片描述

3通过元素的属性值或文本内容来模糊定位元素
3.1基于属性值来模糊查找元素

语法:

//*[contains(@name,'r')]

解释:查找根路径下任意元素中name属性值包含‘r’的元素,共有12个
在这里插入图片描述

3.2基于文本内容来模糊查找元素

语法:

//*[contains(text(),'搜索')]

解释:查找根路径下任意元素中文本内容包含‘搜索’的元素
在这里插入图片描述

4通过元素的路径来定位元素

/表示子级元素
/…表示父级元素
[数值]一般在元素名称后面,当一个元素有多个同名子项时,会用到。若要定位多个元素也可用[*]
在这里插入图片描述

4.1先定位子级元素,再通过子级元素定位父级元素

语法:

//*[@id="kw"]/..

解释:查找根路径下任意元素中id为’kw’元素的父级元素,也就是图片中黄底的元素
在这里插入图片描述

4.2使用完整xpath定位元素(了解即可)

语法:

/html/body/div[1]/div[2]/div[5]/div[1]/div/form/span[1]

解释:从最外层的html元素一直往下找,当有多个同名元素时,用[数字]来区分
在这里插入图片描述

5通过元素是否有某个属性来定位

语法:

//*[@http-equiv]

解释:从更路径下查找任意有http-equiv属性的元素
在这里插入图片描述

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值