如何使用Python Selenium 4定位同class不同属性的筛选按钮

问题场景 #

页面中的筛选按钮class属性完全一致，仅自定义属性e-mappinguid里的列编号有差异，需要精准定位目标按钮。

页面HTML示例 #

<div class="e-filtermenudiv e-icons e-icon-filter" _ngcontent-llr-c3="" e-mappinguid="e-flmenu-grid-column1"></div>
<div class="e-filtermenudiv e-icons e-icon-filter" _ngcontent-llr-c3="" e-mappinguid="e-flmenu-grid-column5"></div>
<div class="e-filtermenudiv e-icons e-icon-filter" _ngcontent-hbl-c3="" e-mappinguid="e-flmenu-grid-column4"></div>
<div class="e-filtermenudiv e-icons e-icon-filter" _ngcontent-hbl-c3="" e-mappinguid="e-flmenu-grid-column8"></div>

你的尝试问题分析 #

你之前的代码中，class属性多写了e-filtered，但实际页面元素的class里并没有这个值，这会直接导致定位失败，需要修正该错误。

可行的定位方法（Python Selenium 4） #

1. XPath定位

通过同时匹配class和e-mappinguid属性实现精准定位：

from selenium.webdriver.common.by import By

# 定位column1的筛选按钮，替换编号即可定位其他列
driver.find_element(By.XPATH, "//div[@class='e-filtermenudiv e-icons e-icon-filter' and @e-mappinguid='e-flmenu-grid-column1']").click()

如果class可能存在动态增减的情况，用contains匹配核心class更稳妥：

driver.find_element(By.XPATH, "//div[contains(@class, 'e-filtermenudiv') and @e-mappinguid='e-flmenu-grid-column1']").click()

2. CSS选择器定位

CSS选择器支持直接引用自定义属性，写法更简洁：

from selenium.webdriver.common.by import By

# 精确匹配所有class和自定义属性
driver.find_element(By.CSS_SELECTOR, "div.e-filtermenudiv.e-icons.e-icon-filter[e-mappinguid='e-flmenu-grid-column1']").click()
# 简化写法，仅匹配核心class和自定义属性
driver.find_element(By.CSS_SELECTOR, "div.e-filtermenudiv[e-mappinguid='e-flmenu-grid-column1']").click()

3. 配合显式等待（处理动态加载元素）

如果按钮是页面动态生成的，建议用显式等待确保元素可点击后再操作：

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

wait = WebDriverWait(driver, 10)
filter_button = wait.until(EC.element_to_be_clickable((By.XPATH, "//div[@e-mappinguid='e-flmenu-grid-column1']")))
filter_button.click()

内容的提问来源于stack exchange，提问作者Edinson Sanchez