目录
在开发者工具的 Elements 中按Ctrl + F，在搜索框中输入 Xpath
前言
xpath是XML路径语言，它可以用来确定xml文档中的元素位置，通过元素路径来完成对元素的查找。HTML就是XML的一种实现方式，所以xpath是一种非常强大的定位方式
一.Xpath介绍
1.基本介绍
XPath（XML Path Language）是一种XML的查询语言，他能在XML树状结构中寻找节点。XPath 用于在 XML 文档中通过元素和属性进行导航
xml是一种标记语法的文本格式，xpath可以方便的定位xml中的元素和其中的属性值。lxml是python中的一个第三方模块，它包含了将html文本转成xml对象，和对对象执行xpath的功能
2.HTML树状结构图
HTML 的结构就是树形结构，HTML 是根节点，所有的其他元素节点都是从根节点发出的。其他的元素都是这棵树上的节点Node，每个节点还可能有属性和文本。而路径就是指某个节点到另一个节点的路线。
2.节点之间的关系
父节点(Parent)： HTML 是 body 和 head 节点的父节点；
子节点(Child)：head 和 body 是 HTML 的子节点；
兄弟节点(Sibling)：拥有相同的父节点，head 和 body 就是兄弟节点。title 和 div 不是兄弟，因为他们不是同一个父节点。
祖先节点(Ancestor)：body 是 form 的祖先节点，爷爷辈及以上👴；
后代节点(Descendant)：form 是 HTML 的后代节点，孙子辈及以下👶。
Xpath中的绝对路径与相对路径
Xpath 中的绝对路径从 HTML 根节点开始算，相对路径从任意节点开始。通过开发者工具，我们可以拷贝到 Xpath 的绝对路径和相对路径代码：
但是由于拷贝出来的代码缺乏灵活性，也不全然准确。大部分情况下，都需要自己定义 Xpath 语句，因此 Xpath 语法还是有必要学习。
绝对路径
Xpath 中最直观的定位策略就是绝对路径。 以百度中的输入框和按钮为例，通过拷贝出来的 full Xpath：
/html/body/div[2]/div/div/div/div/form/span/input
这就是一个绝对路径我们可以看出，绝对路径是从根节点/html开始往下，一层层的表示 出来直到需要的节点为止。这明显不是理智的选项，因此了解以下即可，不用往心里去。 <a name="Rr3Eo"></a>
相对路径
除了绝对路径，Xpath 中更常用的方式是相对路径定位方法，以“//”开头。 相对路径可以从任意节点开始，一般我们会选取一个可以唯一定位到的元素开始写，可以 增加查找的准确性。
二.Xpath的语法介绍
基本定位语法
1.元素属性定位
1.1 根据属性名定位元素：
定位具有特定属性名的元素：//*[@attribute_name]
示例：//*[@class] 会匹配所有具有 "class" 属性的元素。
1.2 根据属性名和属性值定位元素：
定位具有特定属性名和属性值的元素：//*[@attribute_name='value']
示例：//*[@id='myElement'] 会匹配 id 属性值为 "myElement" 的元素。
1.3 根据部分属性值定位元素：
定位具有属性值包含特定文本的元素：//*[contains(@attribute_name,'value')]
示例：//*[contains(@class,'active')] 会匹配 class 属性值包含 "active" 的元素。
1.4 根据多个属性进行定位：
定位具有多个属性及其对应值的元素：//*[@attribute_name_1='value_1' and @attribute_name_2='value_2']
示例：//*[@class='active' and @data-type='button'] 会匹配同时具有 class 属性值为 "active" 和 data-type 属性值为 "button" 的元素
2.层级属性结合定位
2.1定位父元素下的子元素：
//父元素名/子元素名：通过指定父元素和子元素的标签名来定位元素。
2.2 定位特定属性的父元素下的子元素：
//父元素名[@属性名='属性值']/子元素名：通过指定父元素的属性和属性值，再结合子元素的标签名来定位元素。
示例：//div[@class='container']/p 会匹配 class 属性为 "container" 的 <div> 元素下的所有 <p> 元素。
2.3定位特定属性的父元素下的特定属性的子元素：
//父元素名[@属性名1='属性值1']/子元素名[@属性名2='属性值2']：通过指定父元素和子元素的属性条件来定位元素。
示例：//ul[@id='menu']/li[@class='active'] 会匹配 id 属性为 "menu" 的 <ul> 元素下，class 属性为 "active" 的所有 <li> 元素。
3.使用谓语定位
3.1定位符合特定索引的元素：
//tagname[position()]：通过位置索引来定位元素。索引从 1 开始。
示例：//ul/li[position() = 3] 可以匹配位于 <ul> 下的第三个 <li> 元素。
3.1定位满足特定属性条件的元素：
//tagname[@attribute='value']：通过属性条件来定位元素。
示例：//input[@type='text'] 可以匹配所有 type 属性值为 "text" 的 <input> 元素。
3.3结合多个条件定位元素：
//tagname[@attribute1='value1' and @attribute2='value2']：使用逻辑运算符 and 结合多个属性条件来定位元素。
示例：//a[@class='active' and @href='/home'] 可以匹配同时满足 class 属性值为 "active" 和 href 属性值为 "/home" 的 <a> 元素。
3.4通过文本内容定位元素：
//tagname[text()='value']：通过文本内容来定位元素。
示例：//h1[text()='Welcome'] 可以匹配文本内容为 "Welcome" 的 <h1> 元素。
4.使用逻辑运算符定位
使用逻辑运算符定位是XPath中一种灵活的定位技术，允许您结合多个条件来定位元素。XPath支持以下三种逻辑运算符：and、or、not。以下是使用逻辑运算符定位元素的示例：
4.1 使用 and 运算符：
//tagname[@attribute1='value1' and @attribute2='value2']：通过结合多个属性条件，使用 and 运算符定位元素。
示例：//input[@type='text' and @name='username'] 可以匹配type属性为"text"且name属性为"username"的input元素。
4.2 使用 or 运算符：
//tagname[@attribute='value1' or @attribute='value2']：通过结合多个属性条件，使用 or 运算符定位元素。
示例：//a[@class='active' or @class='highlight'] 可以匹配class属性为"active"或"class"属性为"highlight"的a元素。
4.3 使用 not 运算符：
//tagname[not(@attribute='value')]：使用 not 运算符否定一个属性条件，定位不满足该条件的元素。
示例：//div[not(@class='header')] 可以匹配class属性不为"header"的div元素
5.使用文本定位
5.1定位文本内容相等的元素：
//tagname[text()='value']：匹配文本内容与指定值相等的元素。
示例：//a[text()='Login'] 可以匹配文本为"Login"的所有 <a> 元素。
5.2定位包含指定文本内容的元素：
//tagname[contains(text(),'value')]：匹配包含指定值的文本内容的元素。
示例：//p[contains(text(),'Lorem ipsum')] 可以匹配包含"Lorem ipsum"文本的所有 <p> 元素。
5.3根据包含特定关键词的文本内容定位元素：
//tagname[contains(text(),'keyword')]：匹配文本内容中包含特定关键词的元素。
示例：//h2[contains(text(),'Contact')] 可以匹配文本内容中包含"Contact"关键词的 <h2> 元素
6.使用部分函数定位
| | ends-with | 选取属性或者文本以某些字符结尾 | //div[ends-with(@id, 'require')] 选取 id 属性以 require 结尾的 div 元素
