python实战006:find_element_by_xpath()定位DOM元素

最新推荐文章于 2024-08-31 15:18:46 发布

原创最新推荐文章于 2024-08-31 15:18:46 发布 · 1.9w 阅读

57 ·

CC 4.0 BY-SA版权

文章标签：

#Selenium #Python

Python 同时被 2 个专栏收录

9 篇文章

订阅专栏

Selenium

4 篇文章

订阅专栏

部署运行你感兴趣的模型镜像

Selenium提供了很多种定位DOM元素的方法，各有各的特点和优势，这里我大概列了下作用，webdriver就是通过定位这些DOM元素来找到我们想要控制的位置的。

find_element_by_id                //通过id查找单个元素
find_element_by_name              //通过name查找单个元素
find_element_by_xpath             //通过xpath查找单个元素
find_element_by_link_text         //通过链接查找单个元素
find_element_by_partial_link_text //通过部分链接查找单个元素
find_element_by_tag_name          //通过标签名称查找单个元素
find_element_by_class_name        //通过类名查找单个元素
find_element_by_css_selector      //通过css选择武器查找单个元素
find_elements_by_name             //通过name查找多个元素
find_elements_by_xpath            //通过xpath查找多个元素
find_elements_by_link_text        //通过链接查找多个元素
find_elements_by_partial_link_text//通过部分链接查找多个元素
find_elements_by_tag_name         //通过标签名称查找多个元素
find_elements_by_class_name       //通过类名查找多个元素
find_elements_by_css_selector     //通过css选择武器查找多个元素

上面这几种方法中，by_id()，by_name() 比较容易使用，但是在我们的网页中这两个元素使用的不多，所以有这些属性的一般都可以直接使用这连个方法来定位。DOM元素中用的比较多的事class类来定义的，这是我们可以使用by_class_name()，不过class也有个缺点，那就是一个类中会有多个属性值，并且多个位置都有，很难定位要准却的位置。by_link_text()和by_partial_link_text()在定位链接元素的时候用的比较多，当我们要查找某些带链接的标签时可以先考虑这两种方法，by_tag_name()定位标签元素，这个方法感觉很难准确定位到对应位置，因为标签属性在DOM中很容易重复使用，by_css_selector()方法比较好用，我比较喜欢用这个，但是要注意元素层级较深的时候要从前面开始定位，不然会报错。

今天我们主要使用by_xpath()这个方法来定位元素，这个方法比较灵活方便，大部分属性都可以通过它来定位，当然因为太灵活了也不容易掌握。就拿我们自己写的平台来说吧，我们的前端是要哪个vue框架写的，大部分内容都是组件形式存在的，在我们的登录页有个公司选择，它并不是用selec元素来定义的，而是直接从列表中循环获取的。

我们从代码中可以看出，这些内容都在同一个ul中的li中，class类名也一样，标签也一样，span中没有任何属性，唯一不同的就是span中的值不同，这时候by_name()、by_id()、by_class_name()、by_tag_name()、by_link_text()、by_partial_link_text()、by_css_selector()都没法定位到相应的元素，这是by_xpath()的强大就体现出来了。

<ul class="el-scrollbar__view el-select-dropdown__list">
    <li data-v-37fc0e6c="" class="el-select-dropdown__item hover"><span>1公司</span></li>
    <li data-v-37fc0e6c="" class="el-select-dropdown__item"><span>2公司</span></li>
    <li data-v-37fc0e6c="" class="el-select-dropdown__item"><span>3公司</span></li>
    <li data-v-37fc0e6c="" class="el-select-dropdown__item"><span>4公司</span></li>
    <li data-v-37fc0e6c="" class="el-select-dropdown__item"><span>5公司</span></li>
    <li data-v-37fc0e6c="" class="el-select-dropdown__item"><span>6公司</span></li>
    <li data-v-37fc0e6c="" class="el-select-dropdown__item"><span>7公司</span></li>
</ul>

by_xpath好处就是可以一层层定位下来，知道找到我们想要的元素，/代表根目录，每一层我们用/区分，直接找到我们的元素，比如/html/body/div/ul/li/span........,当然这缺点也明显，那就是层级太深了那么对应的路径就会很长很长，下图是我们首页的层级关系，首页内容不多就已经这么长了。

所以这里我们一般都不适用绝对定位来查找属性，而是相对定位，用//区分，表示从当前节点开始寻找所有的后代元素，让相同元素比较多时，我们可以给当前元素加上属性来缩小定位范围，方法是在元素后面加上【@+元素内容】，这里我为了定位准确在li后面加了class属性，这样就指定到了当前的列表中了，然后再根据span的值来判断我们要获取的是哪个公司了。

driver.find_element_by_xpath("//li[@class='el-select-dropdown__item']/span[text()=\"超級公司\"]").click()

除了定位到属性，我们也可以使用一些通用属性来快速定位元素，/* 指某元素下的所有元素，当有多个元素时可以在元素后面加[id]指定位到第几个元素，我这个也可以直接定位第几个span，只是由于这里面的数据并不固定，所以定位下标并不能准确找到想要的元素。

//模拟登录
from selenium import webdriver
from time import sleep

option =webdriver.ChromeOptions()
option.add_argument(r'--user-data-dir=C:\Users\ST-C18110032L\AppData\Local\Google\Chrome\User Data')
driver=webdriver.Chrome(chrome_options=option)
driver.get("http://localhost:8080/#/login")
driver.find_element_by_css_selector('input[type="text"]').send_keys('M0001')
driver.find_element_by_css_selector('input[type="password"]').send_keys('123456')
driver.find_element_by_css_selector('input[class="el-input__inner"]').click()
sleep(2)
driver.find_element_by_xpath("//li[@class='el-select-dropdown__item']/span[text()=\"超級公司\"]").click()
driver.find_element_by_css_selector('input[type="button"]').click()

以下是selenium的其他操作方法，参考博客：https://blog.youkuaiyun.com/eastmount/article/details/48108259

//属性值获取
size 获取元素的尺寸
text 获取元素的文本
get_attribute(name) 获取属性值
location 获取元素坐标，先找到要获取的元素，再调用该方法
page_source 返回页面源码
driver.title 返回页面标题
current_url 获取当前页面的URL
is_displayed() 设置该元素是否可见
is_enabled() 判断元素是否被使用
is_selected() 判断元素是否被选中
tag_name 返回元素的tagName

//元素操作   
clear 清除元素的内容
send_keys 模拟按键输入
click 点击元素
submit 提交表单

//鼠标操作
context_click(elem) 右击鼠标点击元素elem，另存为等行为
double_click(elem) 双击鼠标点击元素elem，地图web可实现放大功能
drag_and_drop(source,target) 拖动鼠标，源元素按下左键移动至目标元素释放
move_to_element(elem) 鼠标移动到一个元素上
click_and_hold(elem) 按下鼠标左键在一个元素上
perform() 在通过调用该函数执行ActionChains中存储行为

//键盘操作
send_keys(Keys.ENTER) 按下回车键
send_keys(Keys.TAB) 按下Tab制表键
send_keys(Keys.SPACE) 按下空格键space
send_keys(Kyes.ESCAPE) 按下回退键Esc
send_keys(Keys.BACK_SPACE) 按下删除键BackSpace
send_keys(Keys.SHIFT) 按下shift键
send_keys(Keys.CONTROL) 按下Ctrl键
send_keys(Keys.ARROW_DOWN) 按下鼠标光标向下按键
send_keys(Keys.CONTROL,'a') 组合键全选Ctrl+A
send_keys(Keys.CONTROL,'c') 组合键复制Ctrl+C
send_keys(Keys.CONTROL,'x') 组合键剪切Ctrl+X
send_keys(Keys.CONTROL,'v') 组合键粘贴Ctrl+V

百度经验： python实战006:find_element_by_xpath定位元素

您可能感兴趣的与本文相关的镜像