Question

在点击按钮打开下拉菜单后，我试图在webdriver中选择这些元素。我可以点击按钮，然后它会下降。

WebElement providers = driver.findElement(By.id("providers"));
      providers.click();

HTML

<input id="providers" class="providersOff" type="button">
<div id="providers-list" class="">
    <ul>
        <li ng-click="searchProvider(0)">
            <div class="imageContainer">
                <span>Google</span> <--TRYING TO SELECT THIS

我正在尝试选择Google元素。

我已经尝试过这两种方法但它不起作用：

driver.findElement(By.cssSelector(".imageContainer[Google]"));
driver.findElement(By.cssSelector(".providers-list > li[ng-click*= searchProvider(0)]"));

它运行起来非常好：

  // Assign search-bar & send keys
      WebElement searchbar = driver.findElement(By.id("txtSearch"));
      searchbar.sendKeys("Pizza");


      // Assign provider drop-down & click
      WebElement providers = driver.findElement(By.id("providers"));
      providers.click();

Answer 1

应该是：

div.imageContainer > span

基本上意味着：

向我提供span元素，该元素是div class="imageContainer"元素的直接子元素。

要获取实际文字，请使用.text：

WebElement span = driver.findElement(By.cssSelector("div.imageContainer > span"));
System.out.println(span.text);

如果您想通过文字匹配span ，可以使用xpath进行处理：

WebElement google = driver.findElement(By.xpath("//div[@class='imageContainer']/span[. = 'Google']")); google.click();

或者，您还可以依赖ng-click元素的li属性：

WebElement span = driver.findElement(By.cssSelector("li[ng-click$='(0)'] > div.imageContainer > span"));

其中$=是ends-with selector。

Answer 2

熟悉基本的CSS选择器可能对您有所帮助。尝试玩这个游戏，我从中学到了很多东西：https://flukeout.github.io/

现在回到你原来的问题。根据您提供的代码部分，最短的选择器只是span

driver.findElement(By.cssSelector("span")); - 它说给我一个html标签但我认为你的页面上有很多跨度，所以这个选择器可能不是唯一的。

driver.findElement(By.cssSelector("#providers-list span")); - 搜索id = providers-list的元素，并在此元素中搜索标记范围。这可能就足够了，但是如果你在这个特定的div中有很多跨度，你可以这样做：

driver.findElement(By.cssSelector("#providers-list .imageContainer span")); - 搜索id = providers-list的元素，在此元素中搜索包含imageContainer的class属性的后代，然后搜索标记span。

您还可以提供元素的完整路径： driver.findElement(By.cssSelector("#providers-list > ul > li > .imageContainer > span")); - ＆＃39;＆gt;＆＃39;说要去指导孩子，而空间意味着去后代（无论多深）。

修改

如果ng-click是唯一的唯一属性，则代码将如下所示 driver.findElement(By.cssSelector("#providers-list li[ng-click='searchProvider(0)'] > .imageProvider > span"));

<强> EDIT2

在扩展下拉列表后（在执行providers.click（）之后），您可能需要等待元素变为可见

WebDriverWait wait = new WebDriverWait(driver, 10); String selector = "#providers-list li[ng-click='searchProvider(0)'] > .imageProvider > span"; WebElement element = wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector(selector)));

如何在span下拉菜单中选择元素cssSelector webdriver Java

2 个答案: