web页面-xpath介绍

1.什么是xpath

可以任意打开一个网页，定位一个元素，点击右击选择【Copy】-->【Copy XPath】，复制出来的xpath内容是：//*[@id="kw"]（相对路径）

还有一种写法【fullXPath】：/html/body/div[2]/div[1]/div[5]/div/div/form/span[1]/input（绝对路径）

由上可见，相对路径要简单一点，而绝对路径较长，容易写错，如果开发修改了路径，就容易出错，所以我们使用中都是使用相对路径，因为绝对路径容易出错

2.为什么要使用xpath

因为前六种元素定位方式的缺点：

• 没有id，name属性
• 通过class_name，tag_name找到的元素不唯一
• link_text，partail_link_text只能定位标签

xpath元素定位优点：

1. 支持所有的元素属性
2. 支持text文本
3. 可能通过标签名
4. 可以通过元素之间的关系
5. 要素和要素可以进行任意形式的组合

 xpath为什么功能强：因为可以组合多个条件，标签名，属性，text，元素之间的关系

3.如何使用xpath

xpath包括的内容：

• 绝对路径，相对路径
• 标签
• 属性
• text文本
• 函数
• 索引
• 元素之间的关系

1. 父子
2. 祖先和子孙后代
3. 同辈

• 轴运算 

相对路径和绝对路径：

// 开头的就是相对路径

/  开头的就是绝对路径

//*[@id="kw"]    * 表示任意的标签名称

//input[@id="kw"] 表示找到属性为input的元素

3.1 xpath基本语法

//标签名[@属性名="属性"]

打开源码，点击一下源码，按ctrl+f，输入xpath表达式后即可搜索

实践当中采取什么的策略去编写xpath表达式：

1. 通过浏览器的右击，复制xpath表达式
2. 通过谷歌安装插件Chropath

3.2 xpath详细语法

文本：//a[text()="抢头标"]

包含某个文本：contains，可以过滤掉文本两边存在空格问题

//a[contains(text(),'抢头标')]，//a[contains(@id,'kw')]

文本和属性组合：//a[text()="抢头标" and @id='kw' and @name='wd']

索引：(//input[@id='kw' and @name='wd'])[1] 

注意：xpath中索引是从1开始的，虽然支持索引，尽量不去用，以免前端代码发生变化，元素定位出错

元素之间的关系：

通过爷爷找孙子：//form[@id='form']//input[@name='wd']

通过父亲找儿子： //span/input[@id='su']

通过儿子找父亲：//input[@id='su']/..

通过儿子找爷爷：//input[@id='su']/../..

轴运算：

ancestor: 定位当前节点的祖先    //input[@id='su']/ancestor::form[@id='form']

following-sibling：找弟弟妹妹   //input[@id='kw']/following-sibling::span

preceding-sibling：找哥哥姐姐   //input[@id='kw']/preceding-sibling::span

运用到代码中如下：

from selenium import webdriver
import time


class TestDeom:
    def test_01(self):
        with webdriver.Chrome() as browser:
            browser.get('http://baidu.com/')
            el = browser.find_element('xpath', '//input[@id="kw"]')
            el.send_keys('许嵩')
            search_button = browser.find_element('xpath', '//input[@id="su"]')
            search_button.click()
            time.sleep(3)
            browser.quit()

 另外一种编写xpath方法：

以免忘记元素定位的方法名称，可以用这种方法

from selenium import webdriver
import time
from selenium.webdriver.common.by import By


class TestDeom:
    def test_01(self):
        with webdriver.Chrome() as browser:
            browser.get('http://baidu.com/')
            el = browser.find_element(By.XPATH, '//input[@id="kw"]')
            el.send_keys('许嵩')
            search_button = browser.find_element(By.XPATH, '//input[@id="su"]')
            search_button.click()
            time.sleep(3)
            browser.quit()