Selenium4.0版本的八种定位元素

如何进行元素定位

定位元素依赖于：标签名、属性、层级、路径

元素定位就是通过元素的信息或元素层级结构来定位元素

浏览器F12开发者工具

元素定位方式

Selenium提供了八种定位元素方式

# 属性名

1.id

2.name

3.class_name(使用元素的class属性)

# 标签名

4.tag_name

# 定位超链接 a 标签

5.link_text

6.partial_link_text(模糊)

# 基于元素路径

7.XPath

# 元素选择器

8.CSS

id 定位

id定位就是通过元素的id属性来定位元素，HTML规定id属性必须是唯一的

前提：元素有id属性

语法：

driver.find_element(By.ID, 'ID名')

案例：

使用本地网页来完成操作

需求：打开注册A.html页面，完成以下操作

1. 使用id定位，输入用户名：admin

2. 使用id定位，输入密码：123456

3. 3秒后关闭浏览器窗口

# 导包
from selenium import webdriver
from selenium.webdriver.common.by import By
from time import sleep

# 获取浏览器对象
driver = webdriver.Chrome()
# 打卡URL
url = r'E:\AA\测试\8.自动化测试\2.Web自动化\注册A.html'
driver.get(url)

# 查找 用户名 元素 ,用户名输入 admin  send_keys("内容")
driver.find_element(By.ID, 'userA').send_keys('admin')
# 查找 密码 元素 ,密码输入 123456
driver.find_element(By.ID, 'passwordA').send_keys('123456')

# 暂停三秒
sleep(3)
# 关闭浏览器
driver.quit()

name定位

name定位就是根据元素name属性来定位。HTML中name的属性值是可以重复的。

前提：元素中有name属性

语法：

driver.find_element(By.NAME, 'name名')

案例：

使用本地网页来完成操作

需求：打开注册A.html页面，完成以下操作

1.使用name定位，输入用户名：admin

2.使用name定位，输入密码：123456

3.3秒后关闭浏览器窗口

# 导包
from selenium import webdriver
from selenium.webdriver.common.by import By
from time import sleep

# 获取浏览器对象
driver = webdriver.Chrome()
# 打卡URL
url = r'E:\AA\测试\8.自动化测试\2.Web自动化\注册A.html'
driver.get(url)

# 查找 用户名 元素 ,用户名输入 admin  send_keys("内容")
driver.find_element(By.NAME, 'userA').send_keys('admin')
# 查找 密码 元素 ,密码输入 123456
driver.find_element(By.NAME, 'passwordA').send_keys('123456')

# 暂停三秒
sleep(3)
# 关闭浏览器
driver.quit()

class_name定位

class_name定位就是根据元素class属性来定位。HTML通过使用class来定义元素样式

前提：元素中有class属性

注意：如果class有多个属性值，只能使用其中一个

语法：

driver.find_element(By.CLASS_NAME, 'class名')

案例：

使用本地网页来完成操作

需求：打开注册A.html页面，完成以下操作

1.使用class_name定位电话号码A，输入用户名：13612345678

3.3秒后关闭浏览器窗口

# 导包
from selenium import webdriver
from selenium.webdriver.common.by import By
from time import sleep

# 获取浏览器对象
driver = webdriver.Chrome()
# 打卡URL
url = r'E:\AA\测试\8.自动化测试\2.Web自动化\注册A.html'
driver.get(url)

# 查找 电话 元素 ,用户名输入 13612345678  send_keys("内容")
driver.find_element(By.CLASS_NAME,'telA').send_keys('13612345678')

# 暂停三秒
sleep(3)
# 关闭浏览器
driver.quit()

tag_name定位

说明：tag_name定位就是通过标签名来定位，每一种标签都会存在很多个，所以不方便精准定位，一般很少使用

语法：

driver.find_element(By.TAG_NAME, '标签名')

# 如果存在多个相同的标签，则返回符合条件的第一个标签

案例：

需求：打开注册A.html页面，完成以下操作

1.使用tag_name定位用户名输入框，输入用户名：admin

3.3秒后关闭浏览器窗口

# 导包
from selenium import webdriver
from selenium.webdriver.common.by import By
from time import sleep

# 获取浏览器对象
driver = webdriver.Chrome()
# 打卡URL
url = r'E:\AA\测试\8.自动化测试\2.Web自动化\注册A.html'
driver.get(url)

# 使用tag_name定位用户名输入框，输入用户名：admin
driver.find_element(By.TAG_NAME, 'input').send_keys('admin')

# 暂停三秒
sleep(3)
# 关闭浏览器
driver.quit()

link_text定位

link_text定位是专门用来定位超链接元素的，是通过超链接的文本来定位元素。

语法：

driver.find_element(By.LINK_TEXT, '链接文本').click()

# 文本内容需要全部匹配

# 注意加 .click() 点击方法

案例：

需求：打开注册A.html页面，完成以下操作

1.使用link_text定位 点击访问 新浪 网站

2. 3秒后关闭浏览器窗口

# 导包
from selenium import webdriver
from selenium.webdriver.common.by import By
from time import sleep

# 获取浏览器对象
driver = webdriver.Chrome()
# 打卡URL
url = r'E:\AA\测试\8.自动化测试\2.Web自动化\注册A.html'
driver.get(url)

# 使用tag_name定位用户名输入框，输入用户名：admin
driver.find_element(By.LINK_TEXT, '访问 新浪 网站').click()

# 暂停三秒
sleep(3)
# 关闭浏览器
driver.quit()

partial_link_text定位

partial_link_text定位是对link_text定位的补充，link_text需要全部匹配元素，而partial_link_text可以局部匹配和全部匹配。

语法：

driver.find_element(By.PARTIAL_LINK_TEXT, '部分链接文本').click()

# 注意加 .click() 点击方法

# 如果存在多个相同的元素，则返回符合条件的第一个元素

案例：

需求：打开注册A.html页面，完成以下操作

1.使用partial_link_text定位 点击 含有 访问 的链接

2. 3秒后关闭浏览器窗口

# 导包
from selenium import webdriver
from selenium.webdriver.common.by import By
from time import sleep

# 获取浏览器对象
driver = webdriver.Chrome()
# 打卡URL
url = r'E:\AA\测试\8.自动化测试\2.Web自动化\注册A.html'
driver.get(url)

# 使用tag_name定位用户名输入框，输入用户名：admin
driver.find_element(By.PARTIAL_LINK_TEXT, '访问').click()

# 暂停三秒
sleep(3)
# 关闭浏览器
driver.quit()

XPath、CSS 定位

为什么要学习XPath、CSS定位？

1.如果定位的元素没有id、name、class属性，如何定位

2.如果通过name、class、tag_name无法定位到唯一元素，如何定位

什么是XPath

1.XPath即为XML Path的简称，它是一门在XML文档中查找元素信息的语言。

2.HTML可以看做XML的一种实现，所以Selenium可以使用这种强大的语言在Web应用中定位元素。

XPath定位策略(方式)

1.路径-定位

2.利用元素属性-定位

3.属性与逻辑结合-定位

4.层级与属性结合-定位

语法：

driver.find_element(By.XPATH,'路径')

路径定位(绝对、相对路径)

绝对路径：从最外层元素到指定元素之间所有经过元素层级的路径

1.绝对路径以 /html 跟节点开始，使用 / 来分隔元素层级；

如：/html/body/div/p[1]/input

2.绝对路径对页面结构要求比较严格，不建议使用

相对路径：匹配任意层级的元素，不限制元素的位置

1.相对路径一 // 开始

2.格式：//input 或者 //*

案例：

需求：打开注册A.html页面，完成以下操作

1.使用绝对路径定位用户名输入框，输入用户名：admin

2.暂停2秒

2.使用相对路径定位密码，输入密码：123456

3.3秒后关闭浏览器窗口

# 导包
from selenium import webdriver
from selenium.webdriver.common.by import By
from time import sleep

# 获取浏览器对象
driver = webdriver.Chrome()
# 打卡URL
url = r'E:\AA\测试\8.自动化测试\2.Web自动化\注册A.html'
driver.get(url)

# 使用绝对路径定位用户名输入框，输入用户名：admin
driver.find_element(By.XPATH, '/html/body/form/div/fieldset/p[1]/input').send_keys('admin')
# 暂停2秒
sleep(2)
# 使用相对路径定位密码，输入密码：123456
driver.find_element(By.XPATH, '//*[@id="passwordA"]').send_keys('123456')

# 暂停3秒
sleep(3)
# 关闭浏览器
driver.quit()

什么是CSS定位

1.CSS是一种语言，它用来描述HTML元素的显示样式

2.在CSS中，选择器是一种模式，用来选择需要添加样式的元素

3.在Selenium中也可以使用这种选择器来定位

提示：

1.在Selenium中CSS定位比XPath速度快

语法：

driver.find_element(By.CSS_SELECTOR,"")

CSS定位常用策略

1.id选择器

2.class选择器

3.元素选择器

4.属性选择器

5.层级选择器

id选择器

说明：根据元素id属性来选择

格式：#id

例如：#userA <选择id属性值为userA的元素>

class选择器

说明：根据元素class属性来选择

格式：.class

例如：.telA <选择class属性值为telA的所有元素>

案例：

需求：打开注册A.html页面，完成以下操作

1.使用css id选择器定位用户名 输入admin

2.使用css 属性选择器定位密码框 输入123456

3.使用css class选择器定位电话号码 输入 13612345678

4.使用css 元素选择器定位span标签获取文本值

5.使用层级选择器定位email 输入 123@qq.com

# 导包
from selenium import webdriver
from selenium.webdriver.common.by import By
from time import sleep

# 获取浏览器对象
driver = webdriver.Chrome()
# 打卡URL
url = r'E:\AA\测试\8.自动化测试\2.Web自动化\注册A.html'
driver.get(url)

# 1.使用css id选择器定位用户名 输入admin
driver.find_element(By.CSS_SELECTOR, '#userA').send_keys('admin')
# 2.使用css 属性选择器定位密码框 输入123456
driver.find_element(By.CSS_SELECTOR, '[name="passwordA"]').send_keys('123456')
# 3.使用css class选择器定位电话号码 输入 13612345678
driver.find_element(By.CSS_SELECTOR, '.telA').send_keys('13612345678')
# 4.使用css 元素选择器定位span标签获取文本值  方法：元素.text
spen = driver.find_element(By.CSS_SELECTOR, 'span').text
print('获取的文本值：', spen)
# 5.使用层级选择器定位email 输入 123@qq.com
driver.find_element(By.CSS_SELECTOR, 'p>input[placeholder="电子邮箱A"]').send_keys('123@qq.com')

# 暂停3秒
sleep(3)
# 关闭浏览器
driver.quit()