Xpath元素定位

1.HTML基础知识

⾸先我们来看下案例⽹页，百度⾸页

我们可以看到，⼀个⽹页，⾥⾯有各种各样的组件。⽐如，图⽚、输⼊框、下拉框、还有各种动画效果。那么，如果要开发⼀个⽹页，必须先掌握哪3个编程语⾔呢?开发⽹页的基础，就是HTML、CSS、Java Script三门语⾔。当然我们如果只是做⾃动化，那只需要稍微了解⼀下相关知识就可以了。

HTML，官⽅的全称呢，是超⽂本标记语⾔。这个名字有点冗长啊。我们只需要知道，HTML，本质上就是⼀个标签语⾔，就⾏了，它就是由各种各样的标签构成的。

标签语⾔，常见的标签有：a： 超链接img： 图⽚

input：输⼊框、⽂件上传button：按钮select：下拉框iframe：窗体p：⽂字。。。。。

通⽤：li、div、span。。。

PS：div,可以做成⽂本框、可以做成按钮、可以做成下拉框，搭配到CSS就能实现各种效果

来看⼀下页⾯实际代码。我们按F12，打开开发者⼯具，这个开发者⼯具是我们做⾃动化经常要⽤的：

我们看到这个开发者⼯具有许多功能页⾯，我们通常搞⾃动化测试的，只需要关注Elements这个页签就够了。这个页签⾥，装载着我们⽹页的页⾯代码。然后，我们可以使⽤左

上⾓这个指针⼯具，左键点击⽹页上的任意地⽅，可以看到Elements⾥，会同步展现出你所指的地⽅对应的⽹页代码。

然后，我们可以使⽤左上⾓这个指针⼯具，左键点击⽹页上的任意地⽅，可以看到Elements⾥，会同步展现出你所指的地⽅对应的⽹页代码。那么让我们看下不同的页⾯元素，代码⼤概是个什么样⼦的。百度搜索框

对应页⾯代码，使⽤了input标签：

页⾯超链接

对应页⾯代码，使⽤了a标签：

整个⽹页，就是由各种各样的标签组成的。那么我们经常讲元素定位，元素定位。我们定位的页⾯元素到底是什么呢？就是我们刚刚看的这些标签。页⾯元素 == 标签

⼤家不要被这满屏的标签代码给吓到了，下⾯我⽤最简单的⽅式教⼤家来认识这些标签。标签基本格式：

text

tagName 就是标签名，attribute1、attribute2就是属性，引号⾥就是属性的值，尖括号之间的是⽂本，⽂本⼀般多⽤于超链接标签还有另外⼀种简单的写法

这两个就是标签的语法，万变不离其宗。

元素定位，就等于定位页⾯标签

以上就是我们需要掌握的HTML基础知识。

2.XPATH元素定位基础

在UI⾃动化所有的元素在操作前都是需要定位的，在Python+Selenium中，定位元素都是基于find_element来实现的，在定位到元素之后，会返回⼀个WebElement对象，执⾏后续被操作的⾏为。

在⾃动化测试中，有且仅有⼋种元素定位的⼿段：1. id2. name3. link text

4. partial link text5. classname6. tagname7. cssselector8. xpath

这8种不同的定位⽅法，⽬前最主流的元素定位是Xpath和CSSSELECTOR，为什么不⽤id、name进⾏定位呢，因为很多前端开发⼯程师开发过程中不太严谨，经常使⽤重名的id和name，或者甚⾄没有。

Xpath是⾮常强⼤的，我们之前也说了，它能解决9999种定位，唯⼀不能解决的就是伪元素，这个可以通过CSS定位解决。接下来，我先给各位撸个简单的XPATH元素定位⾃动化代码案例

#导⼊第三⽅包

from selenium import webdriverfrom time import sleep

#加载驱动

driver = webdriver.Chrome()#打开⽹页

driver.get('http://www.baidu.com')#输⼊关键字，并搜索

driver.find_element_by_xpath('//*[@id=\"kw\"]').send_keys(\"赘婿\")

这就是我们最简单的⼀个使⽤了xpath定位的⾃动化⽤例什么是XPATH

Xpath 是⼀种⽤在 XML ⽂档中定位元素的语⾔，同样也⽀持 HTML 元素的解析。

所谓 Xpath，是指 XML path language。path 就是路径，那么 Xpath 主要是通过路径来查找元素。

HTML树状结构

先介绍⼀下HTML树状结构

HTML 的结构就是树形结构，HTML 是根节点，所有的其他元素节点都是从根节点发出的。其他的元素都是这棵树上的节点Node，每个节点还可能有属性和⽂本。⽽路径就是指某个节点到另⼀个节点的路线。节点之间存在各种关系：

⽗节点(Parent)： HTML 是 body 和 head 节点的⽗节点；⼦节点(Child)：head 和 body 是 HTML 的⼦节点；

兄弟节点(Sibling)：拥有相同的⽗节点，head 和 body 就是兄弟节点。title 和 div 不是兄弟，因为他们不是同⼀个⽗节点。祖先节点(Ancestor)：body 是 form 的祖先节点，爷爷辈及以上󰀀；后代节点(Descendant)：form 是 HTML 的后代节点，孙⼦辈及以下󰀀。

xpath定位形式类似于⽂件系统，根据路径来查找页⾯元素如电脑盘符

C:\\Users\\Public\\Win\\QyConfig.ini

绝对路径和相对路径绝对路径D:/py3/CM..相对路径../

这个就是绝对路径和相对路径的⼀个基本形态。

那么我们⾃动化测试中，经常要碰到的绝对路径和相对路径是什么样⼦的呢，我⽤开发者⼯具，先复制⼀个绝对路径，我们来看⼀下。

绝对路径：/html/body/div[1]/div[1]/div[5]/div/div/form/span[1]/input⾃动化⼀般不⽤绝对路径来定位

我们看到就这个输⼊框，你要⽤绝对路径⾃⼰⼿写出来，得数个9到10层，因此维护的时候，如果出错，⽐较难判断。最常⽤的还是相对路径，同样的，我先复制⼀个相对路径。

相对路径： //*[@id=\"kw\"] （复制搜索框的相对路径）　　// 任意节点出发　　* 所有的元素　　[] 筛选条件

　　@ 通过属性来筛选　　text() 通过text⽂本筛选　　\"\" 查找的值

这个表达式的意思就是操作所有id='kw'的元素

开发者⼯具⾥，有专门验证xpath表达式的地⽅，按ctrl+f可以打开

标黄的就是我们百度搜索框的页⾯元素代码，⾥头有input页签，id属性（值为kw），class属性（值为s_ipt）等等属性以及对应的值

然后说下刚刚我⽤的COPY的使⽤问题，有⼈可能会有疑问。既然可以直接拷贝⽣成Xpath代码，为什么还要学着写。这个是这样的，因为有时候拷贝的代码⽐较冗长，可读性不好。所以咱们⼤部分时候还是需要⾃⼰编写xpath代码来定位的。

3.XPATH元素定位进阶

实际编写⾃动化测试⽤例过程中，可能会碰到各种奇奇怪怪的标签，⽐如没有唯⼀的属性，或者属性值特别长（如超链接的herf属性），接下来学习⼀下各种不同姿势进⾏元素定位的⽅法

逻辑定位：

如果元素的某个属性⽆法精确定位到这个元素，我们还可以⽤逻辑运算符 连接多个属性进⾏定位，逻辑运算符有以下三个：and ：与or ： 或| ： 并集例⼦：

and： //*[@id='kw' and @type='text']

//*[@id='kw' or @name='不存在']

//*[@id='kw'] | //*[text()='直播']有多个结果，结果1：

结果2：

谓语定位：

谓语是 Xpath 中⽤于描述元素位置。主要有数字下标

最后⼀个⼦元素last()元素下标函数position()。例⼦：

数字下标：//form/input[3]

last(): 例：//form/span[1]/input[last()]

倒数第⼏个：//form/span[last()-2]/input

position函数：

//form/span[position()=2]

//form/span[position()>2]

超链接

//*[text()=\"地图\"]

xpath的函数：

contains：通过模糊查找的⾏为查找元素的属性或者⽂本，继⽽查找到这个元素//*[contains(@id,'kw')]

//*[contains(text(),'地')]

当然还有starts-with、end-with函数，但是不推荐⽤，因为经常会报错