如何正确使用 Selenium 定位含多个类名的 HTML 元素-Python教程-PHP中文网

如何正确使用 Selenium 定位含多个类名的 HTML 元素

Selenium 的 find_element(By.CLASS_NAME, ...) 仅支持单个类名，无法匹配含空格的复合类名；当目标元素具有多个 class（如 css-v84xw-NakedButton eml2css7）时，必须改用 By.CSS_SELECTOR 并以点号连接各类名。

selenium 的 `find_element(by.class_name, ...)` 仅支持单个类名，无法匹配含空格的复合类名；当目标元素具有多个 class（如 `css-v84xw-nakedbutton eml2css7`）时，必须改用 `by.css_selector` 并以点号连接各类名。

在自动化测试或网页抓取中，常遇到按钮、卡片等元素拥有多个 CSS 类名（例如

✅ 正确做法是使用 By.CSS_SELECTOR，并以 .class1.class2 格式书写选择器（注意：两个类名间无空格，表示“同时具备这两个类”）：

Selenium 4.48.0

Selenium 4.48.0 官方发布页下载，适合 WebDriver 浏览器自动化测试、Selenium Grid 分布式测试和多语言自动化脚本环境升级。

下载

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

def rooms():
    driver = webdriver.Chrome()
    try:
        driver.get("https://www.qantas.com/hotels/properties/18482?adults=2&checkIn=2024-04-16&checkOut=2024-04-17&children=0&infants=0#view-rooms")

        # 推荐：使用显式等待 + CSS_SELECTOR（更健壮）
        wait = WebDriverWait(driver, 10)
        expand_button = wait.until(
            EC.element_to_be_clickable((By.CSS_SELECTOR, ".css-v84xw-NakedButton.eml2css7"))
        )
        expand_button.click()

    finally:
        driver.quit()

rooms()

⚠️ 注意事项：

❌ driver.find_element('class name', "a b") 是非法用法（字符串 'class name' 已废弃，且不支持多类）；
✅ 必须使用 By.CLASS_NAME（单类）或 By.CSS_SELECTOR（多类、嵌套、属性等复杂场景）；
.class1.class2 表示“同时包含 class1 和 class2”，而 .class1 .class2（中间有空格）表示后代关系，语义完全不同；
实际页面中类名可能动态生成（如 eml2css7），建议优先结合稳定属性定位，例如 data-testid="expand-offer-summary"：
```
driver.find_element(By.CSS_SELECTOR, 'button[data-testid="expand-offer-summary"]')
```

总结：当面对多类名元素时，放弃 By.CLASS_NAME，拥抱 By.CSS_SELECTOR —— 它更灵活、标准且符合现代前端实践。同时务必搭配显式等待，避免因页面异步加载导致的定位失败。