如何用Python的Selenium选择React下拉框中的指定值？

问题核心 #

这个网站用的是自定义下拉组件（非原生<select>标签），所以看不到<option>元素；且三个下拉框类名完全相同，必须通过它们的关联标签文本（Volume/Options Range/Expiration）来精准区分定位，不能直接依赖类名。

解决方案代码 #

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

ticker = "vix"
link = f"https://www.cboe.com/delayed_quotes/{ticker}/quote_table"

driver = webdriver.Chrome("chromedriver")
driver.get(link)
wait = WebDriverWait(driver, 10)  # 超时时间按需调整

# 1. 处理Volume下拉框：选择Greater than 0（注意网站实际拼写，若为Greather则替换文本）
volume_dropdown = wait.until(EC.element_to_be_clickable(
    (By.XPATH, "//div[contains(text(), 'Volume')]/following-sibling::div[contains(@class, 'css-19bqh2r')]")
))
volume_dropdown.click()
volume_option = wait.until(EC.element_to_be_clickable(
    (By.XPATH, "//div[contains(text(), 'Greater than 0')]")
))
volume_option.click()

# 2. 处理Options Range下拉框：选择All
options_range_dropdown = wait.until(EC.element_to_be_clickable(
    (By.XPATH, "//div[contains(text(), 'Options Range')]/following-sibling::div[contains(@class, 'css-19bqh2r')]")
))
options_range_dropdown.click()
options_range_option = wait.until(EC.element_to_be_clickable(
    (By.XPATH, "//div[contains(text(), 'All')]")
))
options_range_option.click()

# 3. 处理Expiration下拉框：选择All
expiration_dropdown = wait.until(EC.element_to_be_clickable(
    (By.XPATH, "//div[contains(text(), 'Expiration')]/following-sibling::div[contains(@class, 'css-19bqh2r')]")
))
expiration_dropdown.click()
expiration_option = wait.until(EC.element_to_be_clickable(
    (By.XPATH, "//div[contains(text(), 'All')]")
))
expiration_option.click()

关键细节说明 #

• 精准定位下拉框：用XPath的following-sibling语法，将下拉框与左侧的标签文本绑定，确保不会选错目标下拉框。
• 等待机制：全程使用WebDriverWait等待元素可点击，避免页面加载延迟导致的元素不可交互报错。
• 选项定位逻辑：自定义下拉的选项通常是<div>元素，直接通过文本内容定位即可（若网站上Volume选项确实是拼写错误的Greather than 0，替换对应文本即可）。

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