• 【selenium】 元素定位


    1、 一般元素定位方式

    示例网页:

    ......
    <input type="text" class="s_ipt" name="wd" id="kw" maxlength="100" autocomplete="off">
    <a href="http://tieba.baidu.com/" target="_blank" class="mnav c-font-normal c-color-t">贴吧a>
    <a href="https://wenku.baidu.com/?fr=bdpcindex" target="_blank" class="mnav c-font-normal c-color-t">一个文本很长的超链接a>
    ......
    
    1. 通过id定位: driver.find_element_by_id("kw")
    2. 通过name定位 :driver.find_element_by_name("wd")
    3. 通过class定位 :driver.find_element_by_class_name("s_ipt")
    4. 通过tag定位:driver.find_element_by_tag_name("input") tag指标签
    5. 通过link定位 :driver.find_element_by_link_text("贴吧")
    6. 通过partical link定位 :driver.find_element_by_partical_link_text("一个文本")

    2、通过xpath定位

    2.1 绝对路径定位

    原理: 类似通过xx省xx市xx区xx路xx号来定位一个人的住址,实际是通过dom树结构定位元素位置
    语法:driver.find_element_by_xpath("/html/body/div/div[2]/div/div/div/from/span/input")
    说明:/表示层级关系,div[2]表示第2个div

    2.2 利用元素属性定位

    原理:通过元素的属性值来定位元素
    语法:

    • find element by_xpath("//input[@id='kw']")
    • find element by_xpath("//input[@maxlength='100']")
    • find element by _xpath("//input[@autocomplete='off]")
    • find element by xpath("//input[@name='wd']")
    • find element by xpath("//*[@class='bg s btn']")

    说明:

    • //input表示当前页面的某个目录下的input标签
    • [@id='kw'] 使用属性id ,对应的属性值是 kw
    • //* 不指定标签名,在所有标签中查找

    2.3 层级和属性结合定位

    原理:某些元素没有特殊的属性可以定位,可以先通过属性定位他的父级元素,然后再通过层级关系定位到这个元素

    <form class="numberform">
        <input value="ejxjdsjjsssddn">
        <input value="ssmkdlfnskslss">
    form>
    

    通过form父元素定位子元素中的第二个input : driver.find_elment_by_xpath('//form[@class="numberform"]/input[2]')

    2.4 使用逻辑运算符定位

    <input class="listitem" name="z1">
    <input class="listitem" name="z1">
    <input class="listitem" name="z2">
    

    通过 and 连接两个属性来定位元素
    driver.find_elment_by_xpath('//input[@class="listitem" and @name="z2"])

    3、通过css定位元素

    1. 通过id定位: driver.find_element_by_css_selector("#kw")
    2. 通过class定位 :driver.find_element_by_css_selector(".s_ipt")
    3. 通过tag定位:driver.find_element_by_css_selector("form>input")
    4. 通过属性定位: driver.find_element_by_css_selector("[name='kw']")
    5. 组合定位:find element by_css selector("span.s_ipt>input.s_ip") 定位标签为span class=s_ipt下的input标签,且input标签的class= s_ip

    xpath和css定位对比

    定位方式xpathcss
    标签//divdiv
    by_id//div[@id=‘elid’]div#elid
    by_class//div[@class=‘elclass’]div.elclass
    属性//div[@title=‘move mouse here’]div[title=Move mouse here] 或 div{title^=Move] 或div[title$=here] 或 div[title*=mouse]
    定位子元素//div/parent/childdiv>parent>child

    4、通过By 定位元素

    通过By定位元素其实是针对以上三种方式的整合,其原理不变,使用示例如下:

    from selenium.webdriver.common.by import By
    
    driver.find_element(By.ID,"kw")
    driver.find_element(By.NAME,"wd")
    driver.find_element(By.CLASS NAME,"'s ipt")
    driver.find_element(By.TAG NAME,"input")
    driver.find_element(By.LINK TEXT,"新闻")
    driver.find_element(By.PARTIAL LINK TEXT,"新")
    driver.find_element(By.XPATH,"//*[@class='bg s btn']")
    driver.find_element(By.CSS SELECTOR,"span.bg s btn wr>input#su")
    

    5、定位一组元素

    定位一组元素与定位一个元素的方式类似

    • 单个元素定位: driver.find_element_by_xx
    • 多个元素定位: driver.find_elements_by_xx

    示例:

    定位单个元素定位一组元素
    driver.find_element_by_class_name(“s_ipt”)driver.find_elements_by_class_name(“s_ipt”)
    driver.find_element_by_xpath(“//*[@class=‘bg’]”)find_elements_by_xpath(“//*[@class='bg]”)
    driver.find_element_by_css_selector(“[name=‘kw’]”)driver.find_elements_by_css_selector(“[name=‘kw’]”)
    driver.find_element(By.CLASS NAME,“'s ipt”)driver.find_elements(By.CLASS NAME,“'s ipt”)

    对一组元素进行操作,如选中下拉控件的每一个元素
    html如下:

    DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>多选控件示例title>
    head>
    <body>
    <h2>请选择您喜欢的水果:h2>
    <form>
        <input type="checkbox" id="apple" name="fruits" value="apple">
        <label for="apple">苹果label><br>
    
        <input type="checkbox" id="banana" name="fruits" value="banana">
        <label for="banana">香蕉label><br>
    
        <input type="checkbox" id="orange" name="fruits" value="orange">
        <label for="orange">橙子label><br>
    
        <input type="submit" value="提交">
    form>
    
    body>
    html>
    

    定位input ,它们有共同的name:fruits

    import os
    from selenium import webdriver
    from selenium.webdriver.common.by import By
    # 访问本地html
    driver = webdriver.Chrome()
    file_path ='file:///'+ os.path.abspath('checkbox.html')
    driver.get(file_path)
    # 定位一组checkbox
    checkboxs = driver.find_elements(By.XPATH, '//input[@name="fruits"]')
    # 遍历一组元素,对每个元素进行点击
    for checkbox in checkboxs:
        checkbox.click()
    

    6、浏览器自带的元素辅助定位功能:

    chrome、edage、firefox 浏览器支持选中元素右键–>检查–>在html源码页面选中元素–>右键–>复制–>

    • 复制xpath
    • 复制完整xpath
    • 复制selector
  • 相关阅读:
    [小程序逆向]PC端VX小程序代码提取
    Linux下编译libevent源码
    使用kubeadm部署kubernetes集群
    TCP 拥塞控制对数据延迟的影响
    FebHost:荷兰.NL域名一个富有影响力域名
    23.2 时间-定时器、格式化时间
    【Kafka】分区与复制机制:解锁高性能与容错的密钥
    一文带你搞定抖音最近最火的情侣微信早报信息推送
    java毕业设计网上租房管理源码+lw文档+mybatis+系统+mysql数据库+调试
    Linux - make与makefile
  • 原文地址:https://blog.csdn.net/xubeiqiannian/article/details/123402229