详细介绍 CSS 选择器
By.CSS_SELECTOR
在 Selenium 中，
By.CSS_SELECTOR
是一种强大且灵活的定位方式。它使用 CSS 选择器语法来查找页面上的元素。CSS 选择器支持复杂的查询语法，可以根据元素的标签、类名、ID、属性等进行组合定位。
示例 HTML
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Selenium Selectors Example</title></head><body><divid="main"class="container"><h1class="header">Welcome to Selenium Tutorial</h1><pname="description">This is a tutorial for learning Selenium.</p><ahref="https://example.com"id="link1"class="link">Click here</a><ahref="https://example.com/about"id="link2"class="link special-link">Learn more</a><form><inputtype="text"name="username"class="input-field"><inputtype="password"name="password"class="input-field"><buttontype="submit"class="button primary">Submit</button></form></div></body></html>
在上面的 HTML 示例中，有一个
<button>
元素，其类名为
button primary
。我们将详细介绍如何使用 CSS 选择器来定位这个元素。
CSS 选择器
By.CSS_SELECTOR
用法示例
from selenium import webdriver
from selenium.webdriver.common.by import By
# 初始化 WebDriver
driver = webdriver.Chrome()# 打开 HTML 文件（假设文件名为 example.html，放在当前工作目录）
driver.get("file:///path/to/your/example.html")# 使用 CSS 选择器定位具有类名 'button primary' 的 <button> 元素
element = driver.find_element(By.CSS_SELECTOR,'.button.primary')print(element.text)# 输出: Submit# 关闭浏览器
driver.quit()
解释
driver.find_element(By.CSS_SELECTOR, '.button.primary')：这行代码使用 CSS 选择器.button.primary来定位元素。.button.primary选择器表示具有button和primary两个类名的元素。print(element.text)：打印出找到的元素的文本内容，这里是Submit。
CSS 选择器语法
CSS 选择器语法支持多种形式，以下是常见的一些用法：
- 通过标签名定位：
element = driver.find_element(By.CSS_SELECTOR,'button')选择所有<button>元素。 - 通过类名定位：
element = driver.find_element(By.CSS_SELECTOR,'.button')选择所有类名包含button的元素。 - 通过ID定位：
element = driver.find_element(By.CSS_SELECTOR,'#link1')选择 ID 为link1的元素。 - 通过属性定位：
element = driver.find_element(By.CSS_SELECTOR,'input[name="username"]')选择name属性为username的<input>元素。 - 组合选择器：
element = driver.find_element(By.CSS_SELECTOR,'div#main.container')选择 ID 为main并且类名为container的<div>元素。 - 后代选择器：
element = driver.find_element(By.CSS_SELECTOR,'div.container h1.header')选择类名为container的<div>内部的类名为header的<h1>元素。 - 子元素选择器：
element = driver.find_element(By.CSS_SELECTOR,'form > input')选择所有form的直接子元素<input>。 - 属性存在选择器：
element = driver.find_element(By.CSS_SELECTOR,'input[name]')选择所有具有name属性的<input>元素。 - 属性值以某个字符串开头：
element = driver.find_element(By.CSS_SELECTOR,'a[href^="https"]')选择所有href属性以https开头的<a>元素。 - 属性值以某个字符串结尾：
element = driver.find_element(By.CSS_SELECTOR,'a[href$=".com"]')选择所有href属性以.com结尾的<a>元素。 - 属性值包含某个字符串：
element = driver.find_element(By.CSS_SELECTOR,'a[href*="example"]')选择所有href属性包含example的<a>元素。
总结
CSS 选择器是 Selenium 中最灵活和强大的定位方式之一。通过结合不同的选择器语法，我们可以精确地定位几乎任何页面元素。在实际应用中，根据具体需求选择合适的 CSS 选择器，可以大大提高定位元素的效率和准确性。
本文转载自: https://blog.csdn.net/abments/article/details/139922211
版权归原作者 abments 所有， 如有侵权，请联系我们删除。
版权归原作者 abments 所有， 如有侵权，请联系我们删除。