CODEWITHSUNDEEP
htmlxpath
Alex
Alex

Reputation: 44415

How to select html element with XPATH based on inner element?

In a html document I have the following situation:

...
<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> 
      ...

Here I want to select the first div element with class ivu-select-selection (second row). The XPATH to get the elements with class ivu-select-selection is

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

but it selects two elements. I just want the element which has the span element with the text Prop below it. I want to select just the second row of this html example. .

How to do that?

Upvotes: 1

Views: 701

Answers (2)

Ishita Shah
Ishita Shah

Reputation: 4035

Try this, 

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

Upvotes: 2

Andersson
Andersson

Reputation: 52695

Try to use below XPath to get required output:

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

Upvotes: 1

Related Questions