10 分钟掌握 Selenium 8 大元素定位法:从踩坑到精通
“为什么我的脚本上午还能跑,下午就 NoSuchElement?”——90% 的问题,都出在定位方式选错或写错。本文用一套 Demo 页 + 8 段可复制的代码,带你一次把 Selenium 定位讲透。
目录
一、准备 30 秒:Demo 页面 & 环境
二、8 大定位方式全景图
三、代码实战:1 个页面 8 种写法
1. ID 定位——首选“身份证”
2. Name 定位——表单第二顺位
3. Class Name 定位——只能写一个完整 class
4. Tag Name 定位——唯一时才用
5 & 6. Link 系列——超链接专属
7. XPath 定位——万能
8. CSS Selector 定位——最简洁的链式写法
四、避坑锦囊(面试高频)
五、一页小抄(收藏图)
六、写在最后
一、准备 30 秒:Demo 页面 & 环境
pip install selenium==4.*
# ChromeDriver 须与浏览器大版本一致
二、8 大定位方式全景图
方式 | 语法示例 | 适用场景&坑 |
---|---|---|
ID | By.ID, "userA" | 最快最稳,但动态 ID 泛滥时失效 |
Name | By.NAME, "passwordA" | 表单常用,可能同名 |
Class Name | By.CLASS_NAME, "telA" | 只能填一个完整 class |
Tag Name | By.TAG_NAME, "input" | 页面唯一标签才安全 |
Link Text | By.LINK_TEXT, "百度" | 超链接全文本匹配 |
Partial Link Text | By.PARTIAL_LINK_TEXT, "网站" | 模糊匹配,注意重复 |
XPath | By.XPATH, "//input[@name='userA']" | 万能但冗长,优先相对路径 |
CSS Selector | By.CSS_SELECTOR, "#userA" | 简洁、高速,支持层级 |
三、代码实战:1 个页面 8 种写法
1. ID 定位——首选“身份证”
driver.find_element(By.ID, "userA").send_keys("admin")
2. Name 定位——表单第二顺位
driver.find_element(By.NAME, "passwordA").send_keys("123456")
3. Class Name 定位——只能写一个完整 class
driver.find_element(By.CLASS_NAME, "telA").send_keys("18600000000")
多 class 场景(如
class="a b"
)请用 CSS。
4. Tag Name 定位——唯一时才用
driver.find_element(By.TAG_NAME, "input").send_keys("唯一 input 才安全")
5 & 6. Link 系列——超链接专属
driver.find_element(By.LINK_TEXT, "百度").click()
driver.find_element(By.PARTIAL_LINK_TEXT, "网站").click()
7. XPath 定位——万能
-
属性定位
driver.find_element(By.XPATH, "//input[@name='userA']").send_keys("admin")
-
层级 + 属性
driver.find_element(By.XPATH, "//p[@id='pa']/input").send_keys("123")
-
文本定位
driver.find_element(By.XPATH, "//*[text()='百度']").click()
-
Contains 模糊
driver.find_element(By.XPATH, "//*[contains(@placeholder,'用户名')]").send_keys("admin")
8. CSS Selector 定位——最简洁的链式写法
-
ID / Class / 属性
driver.find_element(By.CSS_SELECTOR, "#userA").send_keys("admin")
driver.find_element(By.CSS_SELECTOR, ".telA").send_keys("13800000000")
driver.find_element(By.CSS_SELECTOR, "[name='passwordA']").send_keys("123456")
-
层级选择器
driver.find_element(By.CSS_SELECTOR, "form>input").send_keys("父子")
driver.find_element(By.CSS_SELECTOR, "form input").send_keys("子孙")
四、避坑锦囊(面试高频)
坑 | 现场表现 | 修复方案 |
---|---|---|
动态 ID | NoSuchElement | 改用 data-testid 或 CSS 稳态属性 |
多 class 用 CLASS_NAME | InvalidSelectorException | 改用 CSS_SELECTOR ,空格用. 连接 |
XPath 绝对路径 | 页面一改就崩 | 始终用相对路径 + 属性 |
忘记等待 | 元素未加载 | 加 WebDriverWait(driver, 10).until(EC.visibility_of_element_located(...)) |
五、一页小抄(收藏图)
ID → By.ID
Name → By.NAME
Class → By.CLASS_NAME(单 class)
Link → By.LINK_TEXT / PARTIAL_LINK_TEXT
XPath → //标签[@属性='值']
CSS → #id .class [attr='value'] 父子>
六、写在最后
-
优先顺序:ID > CSS > XPath > 其它
-
一条元素定位语句不超过 80 字符,超过就换 CSS/XPath 策略
-
把常用定位封装成 Page Object,拒绝“裸奔”脚本