五、Web控件定位与操作

时间:2021-6-11 作者:qvyue

Selenium的点击与输入

  • 定义
    • driver.find_element(By.ID, 'kw').send_keys('Selenium')
    • driver.find_element(By.ID, 'su').click()

XPATH定义

  • XML Path Language
  • 用于解析html与xml
  • 缺点:速度比较慢,从头到尾遍历
  • 优点:在selenium和appium中都能使用

    五、Web控件定位与操作
    image.png

    五、Web控件定位与操作
    image.png

XPATH实战-对百度网页中的元素进行定位

  1. F12 键调出控制台

  2. 选择Console

    五、Web控件定位与操作
    image.png
  3. Console中的命令:

  • clear() 清空
  • $x("ele") 用xpath进行定位
  1. 点击Elements,选择左右上小箭头对目的元素进行定位
    五、Web控件定位与操作
    image.png
  • id 元素一般是唯一的
  1. 在Console 中进行定位
  • 输入$x("//*[@id='s_tab']") 定位到div
    五、Web控件定位与操作
    image.png
  • 输入$x("//*[@id='s_tab']//b")定位到div下面的b标签
  • 输入$x("//*[@id='s_tab']//a")定位到div下面的a标签,共有9个
    五、Web控件定位与操作
    image.png
  • 输入$x("//*[@id='s_tab']//a[1]")定位到div下面的第一个a标签
    五、Web控件定位与操作
    image.png
  • 输入$x("//*[@id='s_tab']//a[last()]")定位到div下面的最后一个a标签
  • 输入$x("//*[@id='s_tab']//a[last()-1]")定位到div下面的倒数第二个a标签
  1. 定位百度的输入框

    五、Web控件定位与操作
    image.png
  • Console 中输入$x("//*[@name='wd']")$x("//*[@id='kw']"),均能定位到输入框
    五、Web控件定位与操作
    image.png
  1. 定位百度右上角的百度首页
    五、Web控件定位与操作
    image.png
  • 输入$x("//*[@id='u']//a[1]")
    五、Web控件定位与操作
    image.png

///的区别为:前者为父元素下的所有层级元素,即包含儿子、孙子、从孙子等;而后者只能定位父元素的子元素(下一层元素),即只能为儿子。

CSS Selector

  • 可以用于appium 和 selenium,但是appium原生的控件不支持CSS Selector,只支持XPath。手机只有出现webview时才能使用CSS Selector,因为CSS Selector 只能定位网页上的CSS样式

常用的CSS Selector

五、Web控件定位与操作
image.png

五、Web控件定位与操作
image.png

CSS Selector实战

  • Console 输入 $("ele"),表示使用CSS Selector 定位
  1. 输入$('#kw')或者$('id=kw'),定位到 id=‘kw’ 的输入框
五、Web控件定位与操作
image.png

五、Web控件定位与操作
image.png
  1. 输入$('#s_tab b'),定位到网页这个元素,空格代表其子孙元素
    五、Web控件定位与操作
    image.png
  2. 查找第一个a标签,输入#s_tab a:nth-child(1)发现返回结果为0
$('#s_tab a:nth-child(1)')
init [prevObject: init(1), context: document, selector: "#s_tab a:nth-child(1)"]
context: document
length: 0
prevObject: init [document, context: document]
selector: "#s_tab a:nth-child(1)"
__proto__: Object(0)
  • 所以#s_tab a:nth-child(1) 实际找的是a标签的父元素下的第一个子标签
    五、Web控件定位与操作
    image.png
  • 因此要找第一个a标签,应该第二个儿子,应该输入#s_tab a:nth-child(2)
    五、Web控件定位与操作
    image.png
  1. 查找最后一个a标签,输入$('#s_tab a:nth-last-child(1)')
    五、Web控件定位与操作
    image.png

By有些方法的本质其实是CSS_Selector

        if self.w3c:
            if by == By.ID:
                by = By.CSS_SELECTOR
                value = '[id="%s"]' % value
            elif by == By.TAG_NAME:
                by = By.CSS_SELECTOR
            elif by == By.CLASS_NAME:
                by = By.CSS_SELECTOR
                value = ".%s" % value
            elif by == By.NAME:
                by = By.CSS_SELECTOR
                value = '[name="%s"]' % value
        return self.execute(Command.FIND_ELEMENT, {
            'using': by,
            'value': value})['value']

实战代码

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

class TestWait:

    def setup(self):
        self.driver = webdriver.Chrome()
        self.driver.maximize_window()
        self.driver.get('https://www.baidu.com')
        self.driver.implicitly_wait(3)

    def teardown(self):
        self.driver.quit()

    def test_wait(self):
        # 使用By.XPATH 或 By.ID 或 By.CSS_SELECTOR
        # self.driver.find_element(By.XPATH, '//*[@id="kw"]').send_keys('selenium')
        # self.driver.find_element(By.ID, 'kw').send_keys('selenium')
        # 在输入框输入selenium
        self.driver.find_element(By.CSS_SELECTOR, '#kw').send_keys('selenium')
        # 点击百度一下进行搜索
        self.driver.find_element(By.ID, 'su').click()
        sleep(3)

下一节:Web控件交互,包括右键点击、页面滑动、表单填写等自动化动作

声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:qvyue@qq.com 进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。