具有相同 html 结构的两个 div 的 Xpath 和 CSSselector答案

【问题标题】：Xpath and CSSselector for two divs with the same html structure具有相同 html 结构的两个 div 的 Xpath 和 CSSselector
【发布时间】：2016-06-09 05:46:45
【问题描述】：

我有两个 div。要求是我需要单击上传按钮。我需要通过检查按钮文本 Upload 来找到第一个 div 和第二个 div 的 xpath，然后我需要单击它。那么如何找到div的xpath并点击它。是否有同样可用的 CSSselector？

<div class="col-sm-9 col-sm-offset-3 col-lg-10 col-lg-offset-2">
  <button class="btn btn-primary" type="submit">
    <i class="fa fa-upload"/>
      Upload
  </button>
<a href="SomeLinkHere">
<button class="btn" type="button">Cancel</button>
</a>
</div>

<div class="col-sm-9 col-sm-offset-3 col-lg-10 col-lg-offset-2">
  <button class="btn btn-primary" type="submit">
    <i class="fa fa-upload"/>
      Upload
  </button>
<a href="SomeLinkHere">
<button class="btn" type="button">Cancel</button>
</a>
</div>

【问题讨论】：

抱歉试试这个 //i[contains(text(),'Upload')]
@sameerjoshi 这不起作用，因为“上传”在
@Melvin Richard 在上面用按钮替换标签 i 并尝试如果它不起作用然后试试这个 //button[@type,'submit'].click();希望它有效

标签： xpath selenium-webdriver css-selectors

【解决方案1】：

您可以尝试以下 XPath：

//div[./button/i[contains(text(), 'Upload')]]

此 XPath 将返回 div 元素。

编辑：获取button元素

//button[./i[contains(text(), 'Upload')]]

【讨论】：

你好杰森，这不起作用。因为 标签在 Upload 之前关闭。所以基本上 Upload 是写在 button 标签下的。
@MelvinRichard - 我明白你的意思。但我想问一个问题。您使用的是 selenium-webdriver 还是 SeleniumIDE？

【解决方案2】：

我建议你为 firefox 安装 selenium ide。它具有内置的元素定位器，事实证明在像您这样的情况下很有用。

我尝试渲染您在 jsfiddle.net 中提供的 html 代码，并且我设法使用 selenium ide 获取了他们的 xpath。可以看here

【讨论】：