如何根据内部元素选择带有 XPATH 的 html 元素？答案

【问题标题】：How to select html element with XPATH based on inner element?如何根据内部元素选择带有 XPATH 的 html 元素？
【发布时间】：2018-07-03 17:29:13
【问题描述】：

在一个html文档中我有以下情况：

...
<div data-v-16ed3604="" class="ivu-select ivu-select-single ivu-select-small">
  <div tabindex="0" class="ivu-select-selection xh-highlight">
    <input type="hidden" value=""> 
    <div> 
      <span class="ivu-select-placeholder">Prop</span> 
      ...

<div data-v-16ed3604="" class="ivu-select ivu-select-single ivu-select-small">
  <div tabindex="0" class="ivu-select-selection xh-highlight">
    <input type="hidden" value=""> 
    <div> 
      <span class="ivu-select-placeholder">Something else</span> 
      ...

在这里，我想选择 first div 类 ivu-select-selection 的元素（第二行）。获取 ivu-select-selection 类元素的 XPATH 是

//div[@class="ivu-select-selection"]

但它选择了两个元素。我只想要具有span 元素的元素，其下方带有文本Prop。我只想选择这个 html 示例的 第二行。 .

怎么做？

【问题讨论】：

标签： html xpath

【解决方案1】：

试试这个，

//span[contains(text(),'Prop')]//ancestor::div[@class='ivu-select-selection xh-highlight']

【讨论】：

但是我不是用那个表达式选择元素<span class="ivu-select-placeholder">Prop</span>吗？那不是我想要的。我想选择我的 html 示例的第二行...
能否分享下 span 之后的 HTML 行，您要定位的目标
您能否提一下，根据您的示例，您的第二行是什么。 “我想选择我的 html 示例的第二行。”我仍然没有得到，你的实际目标是什么。
请确定你想要定位什么，根据你的问题，它看起来像你想用 Prop 的文本来定位。请忘记你只能通过
来实现它你提到过。尝试使用答案，您将获得“道具”所需的结果。
让我们continue this discussion in chat。

【解决方案2】：

尝试使用下面的 XPath 来获得所需的输出：

//div[@class="ivu-select-selection" and .//span="Prop"]

【讨论】：