Selenium八大元素定位方法

萌新要入行

已于 2023-05-15 11:45:02 修改

阅读量1.1k

点赞数

文章标签： html css 前端测试工具

于 2023-04-09 00:57:17 首次发布

本文链接：https://blog.csdn.net/weixin_43022051/article/details/130037255

版权

八大元素定位方法

查看元素的属性值，通过是在浏览器窗口按下F12，打开开发者工具；

点击工具栏左侧箭头，鼠标移入界面选元素，查看元素属性；

再按Ctrl+f，在输入框输入定位方法，验证是否正确定位到。

在这里插入图片描述

1.通过ID属性选择

示例：

<input type="text" name="uname" id="username" class="px" />

通过ID属性值定位，语法：

driver.find_element(By.ID,'username') 
driver.find_element("id",'username')  #By.ID等价于"id"

2.通过name属性选择

示例：

<input type="text" name="uname" id="username" class="px" />

通过name属性值定位，语法：

driver.find_element(By.NAME,"uname")
driver.find_element("name","uname")

3.通过class属性选择

示例：

<input type="text" name="uname" id="username" class="px" />

通过name属性值定位，语法：

driver.find_element(By.CLASS_NAME,'px')
driver.find_element("class name","px")

注意：class多个值时，只能写一个

4.通过tag名称定位

html代码：

<div id='div1'>
		<p>这是一个段落1</p>
		<p>这是一个段落2</p>
</div>

通过tag name定位，语法：

driver.find_element(By.TAG_NAME, 'p')
driver.find_element("tag name", "P"

注意：find_element(定位1个元素)如果定位到多个，操作的是第一个！

5.通过链接文本定位

通过链接文本定位是针对a标签

示例html代码：

<a href="https://www.baidu.com">百度一下,你就知道</a>

通过link text定位，语法：

driver.find_element(By.LINK_TEXT, '百度一下,你就知道')
driver.find_element("link text","百度一下,你就知道")

6.通过链接部分文本定位

有时候链接文本太长，我们可以使用如下方法，语法

driver.find_element(By.PARTIAL_LINK_TEXT,'百度')
driver.find_element("partial link text","百度")

7.通过xpath定位

<html>
	<head>
		<meta charset="utf-8">
		<title>第二天</title>
	</head>
	<body>
		<div id="div1">
				用户名:<input type="text" name="uname" id="username" class="px" />
				密码:<input type="text" name="pword" id="password" class="pv vm" />
				<br>
				<a href="https://www.baidu.com">百度一下,你就知道</a>
			    <p>这是一个段落1</p>
		</div>
	</body>
</html>

7.1xpath路径法

7.1.1 绝对路径

driver.find_element(By.XPATH,'html/body/div/input')
driver.find_element('xpath','html/body/div/input')

7.1.2 相对路径

"""
//input  所有input标签
//p[1]   父节点下的第一个p标签
//*      定位所有的标签(更多是配合属性法来定位)
"""
driver.find_element('xpath','//input')

7.2 xpath属性法

语法：

[@属性名=‘属性值’]，要结合路径法
//input[@id=‘username’] 所有input标签中id属性为username的元素
//*[@id=‘username’] 因为id唯一，所以可以不论标签
xpath中用class属性值定位的时候，所有class的值都要写入，不能写一个，注意跟前面class定位的区别

示例：

driver.find_element(By.XPATH,"//input[@id='username']")

7.3 xpath函数法

常用的3个：

start-with(@属性名,‘属性开头的值’)
contains(@属性名,‘属性包含的值’)
text()=‘该标签的文本’
contains与text结合： //a[contains(text(),‘a标签包含的文本’)] 非常的常用。

driver.find_element("xpath", "//a[contains(text(),'百度')]")

7.4 xpath逻辑运算符

语法：

//input[@name=‘uname’ and @class=‘px’]

//input[@name=‘uname’ or @ class=‘pv vm’] # 自动化中极少用

8.通过css选择器定位

有以下html代码：

<html>
	<head>
		<meta charset="utf-8">
		<title>第二天</title>
	</head>
	<body>
		<div id="div1">
				用户名:<input type="text" name="uname" id="username" class="px" />
				密码:<input type="text" name="pword" id="password" class="pv vm" />
				<br>
				<a href="https://www.baidu.com">百度一下,你就知道</a>
			    <p>这是一个段落1</p>
			    <p>这是一个段落2</p>
		</div>
	</body>
</html>

8.1 标签名选择器

示例：p 所有p标签

driver.find_element(By.CSS_SELECTOR,'p')

8.2 id选择器

示例：#username id属性的值是username

driver.find_element("css selector",'#username')

8.3 class选择器

示例：.pv.vm class=pv vm’

driver.find_element("css selector",'.pv.vm')

8.4 属性选择器

语法：[属性名=‘属性值’]

示例1：[id=‘username’] id属性值是username
示例2：input[id^=‘usernam’] input标签的id属性开头是usernam
示例3：input[id*=‘sernam’] input标签的id属性值包含sernam
示例4：input[id$=‘ername’] input标签的id属性值结尾是ername

driver.find_element(By.CSS_SELECTOR,"[id='username")
driver.find_element(By.CSS_SELECTOR,'input[id^="usernam"]')
driver.find_element(By.CSS_SELECTOR,'input[id*="ernam"]')
driver.find_element(By.CSS_SELECTOR,'input[id$="ername"]')

8.5 路径选择器

子代选择器示例：html>body html下的body
后代选择器示例：html div html下的div
二弟选择器示例：head+body head紧挨着的body
弟弟示例：div~p 跟div同级，在div之后的弟弟

8.6 伪类选择器

:first-child 第一个元素 body>:first-child body下的第一个标签
:last-child 最后一个元素 body>:last-child body下的最后一个标签
:nth-child(n) 第几个元素 body>div:nth-child(3) body下的第三个标签是div
:nth-last-child 倒数第几个元素 body>div:nth-last-child(4) body下的倒数第四个标签是div
:only-child 唯一元素 input:only-child 每个节点下的唯一一个input标签

driver.find_element(By.CSS_SELECTOR,'div>:first-child')   # 定位到div下第一个标签，即用户名输入框
driver.find_element(By.CSS_SELECTOR,'div>:last-child')    # 定位到div下最后一个标签 ,即 <p>这是一个段落2</p>
driver.find_element(By.CSS_SELECTOR,'div>:nth-child(2)')   # div下第二个标签，即密码输入框

注：xpath是万能的，但是xpath是慢的，css号称速度最快，推荐使用

萌新要入行

关注

0
点赞
踩
9

收藏

觉得还不错? 一键收藏
0
评论
Selenium八大元素定位方法

nth-last-child 倒数第几个元素 body>div:nth-last-child(4) body下的倒数第四个标签是div。:nth-child(n) 第几个元素 body>div:nth-child(3) body下的第三个标签是div。:last-child 最后一个元素 body>:last-child body下的最后一个标签。示例4：input[id$=‘ername’] input标签的id属性值结尾是ername。
复制链接

扫一扫