无法单击隐藏元素，该元素仅在将鼠标悬停在父元素上后才可见答案

【问题标题】：Cannot click on a hidden element, which becomes visible only after hovering over the parent element无法单击隐藏元素，该元素仅在将鼠标悬停在父元素上后才可见
【发布时间】：2019-12-08 00:30:27
【问题描述】：

有 10 个项目。我需要点击 item_9 中的隐藏元素（item-icon）。隐藏元素悬停在他身上后出现。我有同样的情况，同样的代码按预期运行。但在这种情况下，代码会意外运行并在控制台中出现错误。如何点击 item_9 元素中的 item-icon 元素？

html:

<div class="item">
 <div class="w">item_1</div>
  <div class="d">
    <div style="display:none" class="item-icon" role="button" tabindex="-1">
      button1
    </div>
    <div style="display:none" class="item-icon">
      button2
    </div>
  </div>
</div>
<div class="item">
  <div class="w">item_2</div>
  <div class="d">...</div>
</div>
      ...

<div class=""><div class="item">
  <div class="w">item_10</div>
  <div class="d">...</div>
</div></div>

js:

let findItems = await driver.findElements(By.className("item"));
let items = findItems.map(async elem => await elem.getText());
let allItems = await Promise.all(items);
await driver.findElement(By.xpath(`//div[@class='item'][9]//div[@class='item-icon'][2]`)).click();

控制台错误：

{ NoSuchElementError: no such element: Unable to locate element: {"method":"xpath","selector":"//div[@class='item'][9]//div[@class='item-icon'][2]"}

【问题讨论】：

标签： javascript selenium selenium-webdriver selenium-chromedriver

【解决方案1】：

请尝试使用 JavascriptExecutor 点击隐藏元素。

Java 中的示例代码：

JavascriptExecutor js = (JavascriptExecutor)driver;
js.executeScript("arguments[0].click();", element);

【讨论】：

【解决方案2】：

如果元素存在，但您收到错误“NoSuchElementError”，这意味着您尝试在代码中查找的元素存在于网页的“iframe”标签内。例如

<iframe id="iframeID">
<div class="item">
  <div class="w">item_2</div>
  <div class="d">...</div>
</div>
      ...
</iframe>

你需要做的是切换到那个 iframe，然后找到类名为“item”的元素。

driver.switchTo().frame("iframeNameOrID"); //you can use name or id for that iframe
//OR driver.switchTo().frame(0); the zero is the first iframe, you can use 1 for 2nd and so on...
let findItems = await driver.findElements(By.className("item"));
driver.switchTo().defaultContent(); //switch back to the main webpage
//...

我假设您在将鼠标悬停在它上面之前已经看过代码，并且如果您不将鼠标悬停在元素上，您提供的代码也是有效的。我根据提供的数据回答:-)

如果没有 IFRAME... 使用硒悬停

在不悬停的情况下启动页面，使用 Chrome DevTools 选择应该悬停的区域。这将显示您需要悬停的元素。您可以对该元素执行 element.click()，然后执行 java 脚本以创建所需的元素“项目”。

我希望这会有所帮助...在 cmets 中留下问题 :-)

【讨论】：