Selenium定位同class首个元素报TimeoutException解决方法

问题根因 #

你遇到的超时和定位失败来自两个核心错误：

1. Cookie同意按钮位于#usercentrics-root的Shadow DOM内部，你第一次在Shadow Root内点击按钮后，第二次尝试在普通DOM树中查找同一个按钮，根本无法匹配到元素，直接触发超时。
2. 产品链接定位时写死了动态生成的widget-initialized类名，这类类名是页面渲染完成后JS动态追加的，页面刚加载时不存在，会导致定位失败；同时没有处理多同class元素取第一个目标的逻辑。

同class名元素定位首个目标的通用方法 #

所有class名称一致的元素，用以下任意一种方式都可以精准匹配第一个：

• 取元素列表索引0：用find_elements拿到全量匹配的元素列表，Selenium返回的列表严格按照DOM从上到下的渲染顺序排序，索引0对应的就是第一个元素，示例：driver.find_elements(By.CLASS_NAME, "link")[0]
• CSS选择器直接匹配：用伪类div.link:first-child或者div.link:nth-of-type(1)，可以直接定位到第一个class为link的div
• XPath直接匹配：注意XPath索引从1开始，写法为(//div[@class='link'])[1]，必须加括号把全量匹配逻辑包起来，否则会匹配到每个父级下的第一个link元素，不符合预期。

修复后可运行代码 #

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

driverfile = r'C:\Users\Main\Documents\Work\Projects\Scraping Websites\extra\chromedriver'
driver = webdriver.Chrome(executable_path=driverfile)
driver.implicitly_wait(10)

url = "https://www.hugoboss.com/uk/men-clothing/"
driver.get(url)

# 处理Shadow DOM内的cookie同意按钮，仅需点击一次
wait = WebDriverWait(driver, 15)
shadow_root = wait.until(EC.presence_of_element_located((By.XPATH, "//div[@id='usercentrics-root']"))).shadow_root
wait_shadow = WebDriverWait(shadow_root, 10)
wait_shadow.until(EC.element_to_be_clickable((By.CSS_SELECTOR, "button[data-testid='uc-save-button']"))).click()

# 定位第一个产品磁贴链接，去掉动态生成的class，避免定位失败
first_product_link = wait.until(EC.element_to_be_clickable(
    (By.CSS_SELECTOR, "a.product-tile-plp__title-link.js-product-tile-link")
))
# 如果需要获取所有产品链接，直接调用find_elements拿全量列表遍历即可
all_product_links = driver.find_elements(By.CSS_SELECTOR, "a.product-tile-plp__title-link.js-product-tile-link")
# 点击第一个产品
first_product_link.click()

注意事项 #

• 不要重复写相同的点击逻辑，cookie按钮只在Shadow DOM内存在，点击后弹窗消失就不需要二次查找
• 定位元素时不要把JS动态生成的类名作为定位依据，优先选择固定不变、业务语义明确的class或者属性
• 海外站点加载速度普遍偏慢，不要把显式等待时间设置过短；如果需要加载更多产品，在获取全量链接前加页面滚动逻辑即可。

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