域名不变 网站改版vs做网站开发吗
小伙伴们，大家好～
今天给大家梳理一下自动化测试里面的selenium的八种元素定位方式
概念
元素定位：就是要让我们自动化代码找到前端网页中的元素（比如：按钮、输入框等）
注意：selenium定位前端元素有多个时，会默认返回第一个符合条件的元素
假设我们的前端代码如下：
<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Selenium元素定位示例</title><style>body {font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;max-width: 800px;margin: 0 auto;padding: 20px;background-color: #f5f7f9;color: #333;}.container {background-color: white;border-radius: 8px;padding: 25px;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);}h1 {color: #2c3e50;text-align: center;margin-bottom: 30px;}.form-group {margin-bottom: 15px;}label {display: block;margin-bottom: 5px;font-weight: 600;}input[type="text"],input[type="password"] {width: 100%;padding: 10px;border: 1px solid #ddd;border-radius: 4px;box-sizing: border-box;}.submit-btn {background-color: #3498db;color: white;border: none;padding: 12px 20px;border-radius: 4px;cursor: pointer;font-size: 16px;width: 100%;margin-top: 10px;}.submit-btn:hover {background-color: #2980b9;}.links {margin-top: 20px;text-align: center;}.footer {margin-top: 30px;text-align: center;font-size: 14px;color: #7f8c8d;}</style>
</head>
<body><div class="container"><h1>登录页面</h1><form><div class="form-group"><label for="username">用户名:</label><input type="text" id="username" name="username" class="submit-btn" placeholder="输入用户名"></div><div class="form-group"><label for="password">密码:</label><input type="password" id="password" name="password" class="submit-btn" placeholder="输入密码"></div><button type="submit" class="submit-btn">登录</button></form><div class="links"><a href="#">忘记密码?</a> | <a href="#" id="registerLink">点击这里注册</a> | <a href="#">联系我们</a></div><div class="footer"><p>© 2023 示例公司. 所有权利保留.</p></div></div>
</body>
</html>
元素定位
1、通过 ID 定位
通过元素的 id 属性定位。id属性几乎是唯一，定位会非常准确
语法：find_element(By.ID, "id_value")
实现代码：
from selenium.webdriver.common.by import Byelement = driver.find_element(By.ID, "username")
2、通过 Name 定位
通过元素的 name 属性定位。前提是元素有name属性
语法：find_element(By.NAME, "name_value")
实现代码：
element = driver.find_element(By.NAME, "password")
3、通过 Class 定位
通过元素的 class 属性定位。但一般class属性不会唯一
语法：find_element(By.CLASS_NAME, "class_name")
代码实现：
element = driver.find_element(By.CLASS_NAME, "submit-btn")
4、通过 Tag Name 定位
通过元素的标签名定位（如
语法：find_element(By.TAG_NAME, "tag_name")
代码实现：
element = driver.find_element(By.TAG_NAME, "input")
5、通过 CSS 选择器定位
通过 CSS 选择器定位元素。功能强大，写法灵活，强烈推荐！（可直接浏览器右键复制，简单易上手）
语法：find_element(By.CSS_SELECTOR, "css_selector")
代码实现：
element = driver.find_element(By.CSS_SELECTOR, "input#username")
6、通过 XPath 定位
通过 XPath 表达式定位元素。比CSS稍微复杂，但几乎没有它搞不定的定位，强烈推荐！（可直接浏览器右键复制，简单易上手，但可能因为定位过长导致失败）
语法：find_element(By.XPATH, "xpath_expression")
代码实现：
element = driver.find_element(By.XPATH, "//input[@id='username']")
7、通过 Link Text 定位
通过链接的文本内容定位（适用于 标签）
语法：find_element(By.LINK_TEXT, "link_text")
代码实现：
element = driver.find_element(By.LINK_TEXT, "Click Here")
8、通过 Partial Link Text 定位
通过链接的部分文本内容定位（适用于 标签）。算是Link Text定位的简化版
语法：find_element(By.PARTIAL_LINK_TEXT, "partial_link_text")
代码实现：
element = driver.find_element(By.PARTIAL_LINK_TEXT, "Click")
特殊：多个元素定位
有时无论如何修改定位，元素始终有多个，Selenium 提供了 find_elements 方法，返回一个元素列表，而不是直接返回元素（可以解决老大难的问题，尤其在vue等前端框架下非常好用）
语法： find_elements_by_class_name("class_value")
代码实现：
elements = driver.find_elements_by_class_name("csu")
元素定位黄金法则
-
尽量使用
id、name等唯一属性定位元素 -
如果元素属性是动态生成的（如随机 ID），不要使用这些属性定位
-
使用代码等待确保元素加载完成后再进行操作
在我们实际的项目中使用最多的是CSS和XPath定位，由于现在vue等前端框架的使用，ID，name等属性都是由框架进行动态生成，所以使用CSS和XPath的组合定位会比较准确和简单一些。
