如何使用 Selenium select 下拉菜单？

Question

我正在尝试 select EU Odds 从这个 HTML 的下拉列表中：

<div id="user-header-r1">
            <div>
                <a class="user-header-fakeselect" onclick="ElementSelect.expand( 'user-header-oddsformat' , 'user-header-oddsformat-expander' )" id="user-header-oddsformat-expander"><span>UK Odds</span></a>
                <ul class="user-header-fakeselect-options hidden" id="user-header-oddsformat">
                    <li><a href="#" onclick="changeOddsFormat(1); return false;"><span>EU Odds</span></a></li>
                    <li><a href="#" onclick="changeOddsFormat(2); return false;"><span>UK Odds</span></a></li>
                    <li><a href="#" onclick="changeOddsFormat(3); return false;"><span>US Odds</span></a></li>
                    <li><a href="#" onclick="changeOddsFormat(4); return false;"><span>HK Odds</span></a></li>
                    <li><a href="#" onclick="changeOddsFormat(5); return false;"><span>MA Odds</span></a></li>
                    <li><a href="#" onclick="changeOddsFormat(6); return false;"><span>IN Odds</span></a></li>

                </ul>
            </div>
            <div><label>Time:</label></div>
            <div>
                <a href="#" class="user-header-fakeselect" onclick="op.showHideTimeZone();ElementSelect.expand( 'user-header-timezone' , 'user-header-timezone-expander' , null , function(){op.hideTimeZone()} );this.blur();return false;" id="user-header-timezone-expander"><span>23 Aug 08:33, GMT +1</span></a>
            </div>


        </div>

我已尝试使用以下代码遵循答案：

target = 'EU Odds'
self.driver.find_element_by_css_selector("user-header-r1 > ul").find_element_by_xpath("./li[.="+target+"]").click()

但我收到以下错误：

Exception has occurred: NoSuchElementException
Message: no such element: Unable to locate element: {"method":"css selector","selector":"user-header-r1 > ul"}

我哪里错了？

Answer 1

展开下拉菜单并使 li 个元素可见。 WebDriverWait 将等待所需的元素条件，在您的情况下它是可见性。要使用 xpath 按文本获取元素，您需要在文本中使用配额 //li[.='Some Text']：

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

driver = webdriver.Chrome()
wait = WebDriverWait(driver, 5)
driver.get("..")

target = "EU Odds"
driver.find_element(By.ID, "user-header-oddsformat-expander").click()
wait.until(ec.element_to_be_clickable((By.XPATH, "//li[.='" + target + "']"))).click()

Answer 2

到 select 文本为 EU Odds 的元素你需要归纳 for the element_to_be_clickable() and you can use either of the following :

使用CSS_SELECTOR:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "ul#user-header-oddsformat li:first-child>a[onclick^='changeOddsFormat']>span"))).click()

使用XPATH:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//ul[@id='user-header-oddsformat']//li/a[starts-with(@onclick, 'changeOddsFormat')]/span[text()='EU Odds']"))).click()

注意：您必须添加以下导入：

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

Answer 3

您的元素目标具有 hidden 值的属性：

...<ul class="user-header-fakeselect-options hidden"...

所以我认为你需要先从另一个元素触发，然后再攻击元素目标，试试下面的代码：

#click this first
self.driver.find_element_by_css_selector('div#user-header-r1 > div > a#user-header-oddsformat-expander > span').click()

target = 'EU Odds'
self.driver.find_element_by_xpath('//ul[@id="user-header-oddsformat"]//span[text()="' +target +'"]').click()

Answer 4

形成 HTML 元素，您尝试 select 的元素有一个名为 user-header-r1 不是 CSS class，请尝试使用 find_element_by_id('user-header-r1') 然后，如果找到该元素，则尝试在同一搜索中使用 find_element_by_tag_name('ul')，如下所示：

head_elem = self.driver.find_element_by_id("user-header-r1")
head_elem.find_element_by_tag_name("ul")

这将首先扫描 HTML 树以查找 ID 为 user-header-r1 的第一个 div，然后在 div 中找到 ul 元素

如何使用 Selenium select 下拉菜单？

How to select a dropdown using Selenium?

python

selenium

xpath

css-selectors

webdriverwait