selenium11-XPath元素定位的方法

XPath是一种十分强大的定位元素的方法,XPath定位和CSS定位相比有更大的灵活性。本篇文章的重点主要讲解“xpath元素定位的基本方法”,希望感兴趣的小伙伴可以坚持看下去同时欢迎提出宝贵的意见让我们一起进步！

01：XPath简单介绍

1）概述：XPath(XML Path Language)是W3C定义的用来在XML文档中选择节点的语言。

2）支持：主流浏览器(Chrome、Firefox，Edge，Safari)也支持XPath语法

3）特点：语法非常像Linux系统中的路径,所以又叫做路径表达式

4）场景：XPath有从当前节点选择父节点的功能,这是CSS selector所不具备的

前置条件：
from selenium import webdriver
driver=webdriver.Chrome()
driver.implicitly_wait(5)
driver.get('https://www.51job.com/')

02：XPath语法结构

1）绝对路径：从根节点（html）开始, 路径分割符是/,类似css中的>符号。如：/html/body/div

2）相对路径：以//开头后面加元素名称, 用法类似于css中的后代选择器。//表示从当前节点寻找所有的后代元素,不管它在什么位置。如：//span

3）组合使用：//div/p/span

4）通配符：*,表示匹配所有元素。

5）用法：//div/* ;表示匹配div下面所有元素

（1）绝对路径写法：选择html文档对应路径下的div元素
div=driver.find_elements_by_xpath('/html/body/div')
（2）相对路径写法：选择html文档下所有的div元素
div=driver.find_elements_by_xpath('//div')
（3）组合路径写法：p和span分别属于div元素的子元素与孙元素
div=driver.find_elements_by_xpath('//div/p/span')
（4）通配符写法：匹配div下面所有元素
div=driver.find_elements_by_xpath('//div/*')

03：根据属性选择

1）使用场景：选择具有某个属性（值）的元素

2）表示方法：属性前面加一个[@属性],属性值必须加引号

①//*[@属性] 表示选择具有某个属性的元素

②//*[@属性=“属性值”] 表示选择具有某个属性值的元素,属性值必须加引号（单引号双引号都可以）

③包含某(value)属性：/*[contains(@属性,“value”)]

④某属性以value开头：//*[starts-with(@属性,“value”)]

⑤某属性以value结尾：//*[ends-with(@属性,“value”)]

⑥多属性组合使用：//*[@属性=“属性值”][@属性=“属性值”]

⑦and和or组合使用：//*[@属性=“属性值”or/and@属性=“属性值”]

3）注意事项：在xpath中没有表示id和class的特殊方法,id 、class 也是属性

（1）根据id属性选择
div=driver.find_elements_by_xpath('//div/p/input[@id="kwdselectid"]')
（2）根据class属性选择
div=driver.find_elements_by_xpath('//div/p[@class="ipt"]')
（3）包含ufm属性的元素
div=driver.find_elements_by_xpath('//div[contains(@class,"ufm")]')
（4）以ufm属性开头的元素
div=driver.find_elements_by_xpath('//div[starts-with(@class,"ufm")]')
（5）多属性组合使用
div=driver.find_elements_by_xpath('//iframe[@name="login_iframe"][@onload="load()"]')
（6）and和or的使用
div=driver.find_elements_by_xpath('//input[@type="hidden" or @id="showguide"]')符合其中一个
div=driver.find_elements_by_xpath('//input[@type="hidden" and @id="showguide"]')两者都符合

04：根据子元素选择-单选

1）表示方法：如//ul[@id="languagelist"]/li[1],若不写元素类型可以直接写*(通配符)

①正数第一个：//*[@属性=“属性值”]/元素[n]或者“[n]等价于[position()=n]”

②倒数第一个：//*[@属性=“属性值”]/元素[last()]或者“[last()]等价于[position()=last()]”

③倒数第二个：//*[@属性=“属性值”]/元素[last()-1]或者“[last()-1]等价于[position()=last()-1]”

2）使用场景：选择属于其父元素的第n个某个类型的子元素

（1）定位ul下的正数第一个li元素
li=driver.find_elements_by_xpath('//ul[@id="languagelist"]/li[1]')
li=driver.find_elements_by_xpath('//ul[@id="languagelist"]/li[position()=1]')
（2）定位ul下的倒数第一个li元素
li=driver.find_elements_by_xpath('//ul[@id="languagelist"]/li[last()]')
li=driver.find_elements_by_xpath('//ul[@id="languagelist"]/li[position()=last()]')
（3）定位ul下的倒数第二个li元素
li=driver.find_elements_by_xpath('//ul[@id="languagelist"]/li[last()-1]')
li=driver.find_elements_by_xpath('//ul[@id="languagelist"]/li[position()=last()-1]')

05：根据子元素选择-多选

1）表示方法：如//ul[@id="languagelist"]/li[position()=last()-1]

①前2个：//*[@属性=“属性值”]/元素[position()<3]

②除了最后1个：//*[@属性=“属性值”]/元素[position()<last()]

2）使用场景：选择属于其父元素的第m到n之间某个类型的子元素

（1）定位ul下的前2个li元素
li=driver.find_elements_by_xpath('//ul[@id="languagelist"]/li[position()<3]')
（2）定位ul下的除了倒数第一个li元素(最后一个元素之前的元素)
li=driver.find_elements_by_xpath('//ul[@id="languagelist"]/li[position()<last()]')

06：根据组选择元素

1）表示方法：<s1>|<s2>;<s1>和<s2> 是两组xpath选择器

2）使用场景：用于多组xpath表达式组合来选择元素的情况

3）注意事项：css和xpath的表达式不能混用

ele=driver.find_elements_by_xpath('//ul[@id="languagelist"]/li[1]|//div[@class="app"]')

07：根据相邻兄弟选择元素

1）表示方法：如//div[@class="app"]/following-sibling::div

①选择后面的兄弟元素：//*/following-sibling::

②选择前面的兄弟元素：//*/preceding-sibling::

2）使用场景：根据同级元素选择其他的同级元素

（1）选择后面的兄弟元素
ele=driver.find_elements_by_xpath('//div[@class="app"]/following-sibling::div')
ele=driver.find_elements_by_xpath('//div[@class="app"]/following-sibling::div[1]')
（2）选择前面的兄弟元素
ele=driver.find_elements_by_xpath('//div[@class="app"]/preceding-sibling::div')
ele=driver.find_elements_by_xpath('//div[@class="app"]/preceding-sibling::div[1]')
（3）选择距离li元素最远的兄弟元素
ele=driver.find_elements_by_xpath('//div[@class="app"]//following-sibling::li[last()]')
（4）选择li元素后面第2个到最后一个的兄弟元素
ele=driver.find_elements_by_xpath('//div[@class="app"]//following-sibling::li[position()>1]')

08：根据父元素选择

1）表示方法：//p/.. ;选择p的父元素

2）使用场景：根据子元素定位父元素

ele=driver.find_elements_by_xpath('//div[@class="app"]/..')

09：调用当前webelement内部使用XPath小技巧（.）

如果是从当前webelement调用find_element_by_xpath,需要在表达式前面加个相对路径点“.”

div=driver.find_element_by_id('many')
ele=div.find_elements_by_xpath('.//*[@class="special"]')

10：验证XPath方法

①打开控制台,element标签内查找,会做字符匹配。比如：/html/body/div

②打开控制台,console内查找,更精确。比如：$x('/html/body/div')

XPath-element标签内查找.png XPath-console内查找.png