当前位置: 移动技术网 > IT编程>网页制作>HTML > 荐 Selenium元素定位方法详解

荐 Selenium元素定位方法详解

2020年07月16日  | 移动技术网IT编程  | 我要评论

web的功能测试简单来说其实就是在某个页面中找到某个元素然后进行操作,对人工操作而言,页面的元素通过图形或文字已经呈现了出来;而所谓的对自动化就是使用代码来代替人工操作去点击,输入等等,那需要做的第一件事就是告诉代码去操作哪个页面元素。

接下来以百度首页为例,介绍几种常用的定位方式:在这里插入图片描述
先看下浏览器定位的小工具:
1.打开浏览器(这里用的是Chrome),按F12进入开发者工具选项,点击Elements
2.点击小箭头(图1)
3.鼠标划动至页面中要操作的元素点击一下
4.对应的html元素内容则会有深蓝色背景显示(图2)
在这里插入图片描述
可以看到元素中有class,name,id属性,可以通过这些属性去定位,来看下python语法:

id定位find_element_by_id()
id的值是当前整个HTML页面中唯一的,所以通过id属性定位是首选的定位方式,但不是每个元素都有id属性。

from selenium import webdriver
dr=webdriver.Chrome()
dr.get('https://www.baidu.com')
dr.maximize_window()
#通过id定位
dr.find_element_by_id('kw').send_keys('测试')

name定位find_element_by_name()

from selenium import webdriver
dr=webdriver.Chrome()
dr.get('https://www.baidu.com')
dr.maximize_window()
#通过name定位
dr.find_element_by_name('wd').send_keys('测试')

class定位find_element_by_class_name()

from selenium import webdriver
dr=webdriver.Chrome()
dr.get('https://www.baidu.com')
dr.maximize_window()
#通过class定位
dr.find_element_by_class_name('s_ipt').send_keys('测试')

Tag name定位find_element_by_tag_name()
指的是通过标签去定位,比如百度首页(如图),其中的div,a,iuput等等很多tag,所以通过这种方法去定位是达不到唯一性的,自动化测试中也是很少用到的,爬虫可能用的比较多。
在这里插入图片描述

find_element_by_tag_name('input')

通过文本连接去定位,一共提供了两种定位方式:
1.文本内容全部匹配
link定位:find_element_by_link_text()
2.文本内容模糊匹配
partial link定位:find_element_by_partial_link()

在这里插入图片描述
如图可以通过 新闻、地图、等文本去定位

from selenium import webdriver
dr=webdriver.Chrome()
dr.get('https://www.baidu.com')
dr.maximize_window()
#通过link定位
dr.find_element_by_link_text('新闻').click()
#模糊匹配
dr.find_element_by_partial_link_text('闻').click()

以上介绍的几种定位方法,都是针对元素的单一特征来定位元素,而在实际应用中有的元素没有这些属性,或者属性的值相同,这时候只能通过xpath和css来组合多个特征或属性去定位元素,两种方法基本可以覆盖所有的元素定位方式。

xpath定位find_element_by_xpath()

基本语法:

表达式 说明
/ 绝对定位,从根节点选取
// 相对定位,从匹配选择的当前节点选择文档中的节点,而不考虑他们的位置。
. 选取当前节点
选取当前节点的父节点
@ 选取属性。@class=’xxx‘,@name=‘xxx’…属性放到[]中
* 通配符,匹配所有

首先来看下如何去检验定位表达式是否正确,如下:
在Elements区域按Ctrl+F,弹出输入区域,输入表达式1,黄色背景代表找到的元素,图中2表示页面中元素的数量及总数。
在这里插入图片描述
xpath定位的方式丰富多彩,接下来一一介绍下。
绝对路径
绝对路径去定位百度输入框:/html/body/div/div[2]/div[5]/div[1]/div/form/span[1]/input
以但斜杠/开头从根元素html标签开始,一层层的检索下来,直到被查找的元素

find_element_by_xpath('/html/body/div/div[2]/div[5]/div[1]/div/form/span[1]/input')

相对路径:通过标签名+属性定位://标签名[@属性名=属性值)]
相对路径://input[@id=‘kw’],
以双斜杠//开头,不用考虑元素的路径和位置,考虑页面是否存在符合表达式的元素即可

find_element_by_xpath("//*[@id='kw']")

就两者表达式的长度来说,实际工作中用绝对路径也会比较少,而两者区别不止如此:
1.页面层级一旦发生变化,绝对路径就会失效,而相对路径更灵活,容错性低
2.绝对路径是一层层去检索,会很慢;而相对路径会直接在某个位置匹配相应的表达式

组合元素索引(下标)定位://标签名[@属性名=属性值)]/标签名/索引
通过下标去定位,类似于python中的索引,但是html中是从0开始的,如下:
我想定位到’地图‘元素,通过xpath可以先定位到父级,然后再根据下标定位到同级中的位置:
地图://div[@id=‘s-top-left’]/a[3]
贴吧://div[@id=‘s-top-left’]/a[5]
在这里插入图片描述
通过部分属性值匹配://标签名[contains(@属性名,部分属性值)]
还以上图为例,定位”地图“元素://div[contains(@id,‘left’)]/a[3]
在这里插入图片描述
使用文本内容匹配://标签名[text()=‘文本内容’]
定位‘新闻’元素://a[text()=‘新闻’]
在这里插入图片描述
匹配部分文本可以与contains结合使用://标签名[contains(text(),‘部分文本内容’)]
定位‘贴吧’元素://a[contains(text(),‘贴’)]
在这里插入图片描述

前面介绍的几种定位方式其实都是调用了find_element的定位方法,只是又进行了二次封装又衍变出来的几种方式,来看下源码:
以find_element_by_id()为例
在这里插入图片描述
所以也可以直接调用find_element()方法:

find_element('id','kw')
find_element('name','wd')
find_element('xpath',"//*[@id='kw']")

最后还有两种方式:
xpath中的轴定位css定位,内容比较多后续有时间了单独写。

本文地址:https://blog.csdn.net/weixin_42262081/article/details/107316276

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网