Loading

Xpath选择器

绝对路径选择

从根节点开始的,到某个节点,每层都依次写下来,每层之间用 / 分隔的表达式,就是某元素的 绝对路径

自动化程序要使用Xpath来选择web元素,应该调用 WebDriver对象的方法 find_element_by_xpath 或者 find_elements_by_xpath

elements = driver.find_elements_by_xpath("/html/body/div")

相对路径选择

xpath需要前面加 // , 表示从当前节点往下寻找所有的后代元素,不管它在什么位置。

//div

‘//’ 符号也可以继续加在后面,要选择 所有的 div 元素里面的 所有的 p 元素 //div//p

elements = driver.find_elements_by_xpath("//div//p")

通配符

如果要选择所有div节点的所有直接子节点,可以使用表达式 //div/*

elements = driver.find_elements_by_xpath("//div/*")
for element in elements:
    print(element.get_attribute('outerHTML'))

根据属性选择

Xpath 可以根据属性来选择元素。

根据属性来选择元素 是通过 这种格式来的 [@属性名='属性值']

注意:

  • 属性名注意前面有个@
  • 属性值一定要用引号, 可以是单引号,也可以是双引号

根据id属性选择

选择 id 为 west 的元素

//*[@id='west']

根据class属性选择

选择所有 select 元素中 class为 single_choice 的元素

 //select[@class='single_choice']

一个元素class 有多个

<p id="beijing" class='capital huge-city'>
    北京  
</p>    //不能只写一个属性,像这样 //p[@class="capital"] 则不行

如果要选 它, 对应的 xpath 就应该是:

//p[@class="capital huge-city"]

根据其他属性

选择 具有multiple属性的所有页面元素 :

//*[@multiple]

属性值包含字符串

要选择 style属性值 包含 color 字符串的 页面元素:

//*[contains(@style,'color')]

要选择 style属性值 以 color 字符串 开头 的 页面元素:

//*[starts-with(@style,'color')]

要选择 style属性值 以 某个 字符串 结尾 的 页面元素 :

//*[ends-with(@style,'color')] //这是xpath 2.0 的语法 ,目前浏览器都不支持

按次序选择

某类型 第几个 子元素

选择 p类型第2个的子元素:

//p[2]    //选择的是 p类型第2个的子元素 , 不是 第2个子元素,并且是p类型 。

选取父元素为div 中的 p类型 第2个 子元素:

//div/p[2]

第几个子元素

可以选择第2个子元素,不管是什么类型,采用通配符

比如 选择父元素为div的第2个子元素,不管是什么类型

//div/*[2]

某类型 倒数第几个 子元素

  • 选取p类型倒数第1个子元素
//p[last()]
  • 选取p类型倒数第2个子元素
//p[last()-1]
  • 选择父元素为div中p类型倒数第3个子元素
//div/p[last()-2]

范围选择

  • 选取option类型第1到2个子元素
//option[position()<=2]

或者

//option[position()<3]
  • 选择class属性为multi_choice的前3个子元素
//*[@class='multi_choice']/*[position()<=3]
  • 选择class属性为multi_choice的后3个子元素
//*[@class='multi_choice']/*[position()>=last()-2]

不是 last()-3 因为

last() 本身代表最后一个元素

last()-1 本身代表倒数第2个元素

last()-2 本身代表倒数第3个元素

组选择、父节点、兄弟节点

组选择

要选所有的option元素 和所有的 h4 元素:

//option | //h4

要选所有的 class 为 single_choice 和 class 为 multi_choice 的元素:

//*[@class='single_choice'] | //*[@class='multi_choice']

选择父节点

xpath可以选择父节点, 这是css做不到的。

某个元素的父节点用 /.. 表示

要选择 id 为 china 的节点的父节点:

//*[@id='china']/..

继续找上层父节点:

//*[@id='china']/../../..

兄弟节点选择

选择 后续 兄弟节点,用这样的语法 following-sibling::

要选择 class 为 single_choice 的元素的所有后续兄弟节点:

//*[@class='single_choice']/following-sibling::*

要选择后续节点中的div节点:

//*[@class='single_choice']/following-sibling::div

还可以选择 前面的 兄弟节点,用这样的语法 preceding-sibling::

要选择 class 为 single_choice 的元素的所有前面的兄弟节点:

//*[@class='single_choice']/preceding-sibling::*

CSS选择器目前还没有方法选择前面的 兄弟节点

xpath轴选择

//div[text()="系统管理"]    #系统管理是元素内的文本

🎉

posted @ 2020-12-11 20:43  猫鱼故巷  阅读(424)  评论(0编辑  收藏  举报