How to locate a div with non unique id/class, which contains a div with a certain text and then fetch all the and tags under that div

Question

So I have HTML something like this.

<div class="generic classname" id="generic ID name" >  // div1
<div class="presentation" id="body presentation">      // div2
<font>unique text</font>
<div class= "generic classname" id="generic ID name""> //div3
// under this div I have the table entry.
// multiple <td> and <tr>
</div>
</div>
</div>

My job is to match the "unique text" in div no 2, so I can locate the element div number 1 and then fetch all the table in div no 3

The problem is I am not sure how to locate the div which doesn't have a unique class name or id name. I can't use full XPath, since the table changes and the divs change randomly.

_so I can locate the element div number 1 and then_ Why do you want to venture into `div1`? — undetected Selenium, Aug 20 '20 at 13:58

score 1 · Answer 1 · answered Aug 20 '20 at 12:56

1

Use the below xpath with reference to div 2 to find the unique text and then find div and table inside div.

//div[./font[text()='unique text']]/div[1]/table

answered Aug 20 '20 at 12:56

KunduK

32,888
5
17
41

score 1 · Answer 2 · answered Aug 20 '20 at 12:59

If all your divs are nested as you say and your aim is to get the table in div3, you don't need to get the parent.

This is one option:

//font[text()='unique text']/following-sibling::div

This xpath finds the font with your unique text then it's sibling (same parent) div

This xpath identifier is another option:

//font[text()='unique text']/parent::*/div

this xpath finds the font with your unique text then get it's * (any) parent then gets the relevant div inside it.

You can do the parent axes to up again if you want "div1".

Looks like this in devtools:

This is based on your html looking like:

<div class="generic classname" id="generic ID name" >
    <div class="presentation" id="body presentation">
        <font>unique text</font>
        <div class="generic classname" id="generic ID name""> 
            // under this div I have the table entry.
            // multiple <td> and <tr>
        </div>
    </div>
</div>

Different HTML would need a different xpath so please say if you need to update.

undetected Selenium · Accepted Answer · 2020-08-20T14:14:42.743

1

As per the HTML:

<div class="generic classname" id="generic ID name" >  // div1
    <div class="presentation" id="body presentation">      // div2
        <font>unique text</font>
        <div class= "generic classname" id="generic ID name"> //div3
            // under this div I have the table entry.
            // multiple <td> and <tr>
        </div>
    </div>
</div>

As your usecase is not dependent on any of the <div1> attributes, you can easily avoid considering <div1>.

Solution

To locate the third <div> you have four approaches as follows:

Using the text unique text and <div> attributes:

//font[text()='unique text']//following::div[@class='generic classname' and @id='generic ID name']

Using the textunique text and index:

//font[text()='unique text']//following::div[1]

Using the <div2> which have a child <font> tag with text as unique text and <div> attributes:

//div[./font[text()='unique text']]//following-sibling::div[@class='generic classname' and @id='generic ID name']

Using the <div2> which have a child <font> tag with text as unique text and index:
```
//div[./font[text()='unique text']]//following-sibling::div[1]
```

edited Aug 20 '20 at 14:14

answered Aug 20 '20 at 14:07

undetected Selenium

183,867
41
278
352

One more question I also encountered a case where the tag has another
tag with 'unique text'. so div2 has a child div which has the text. the table is located on the same level as div2. How would I then locate the table?
– Bounty Collector Aug 20 '20 at 19:52
1

@BountyCollector _... tag has another
tag with 'unique text'..._ but we are considering the `` tag in the first and second option with 'unique text'. So IMO, this still should work.
– undetected Selenium Aug 20 '20 at 20:14
You are absolutely right. I just tested it for both cases and it seems to work flawlessly. I am pretty new to this stuff, do you have a resource recommendation? – Bounty Collector Aug 20 '20 at 21:56
@BountyCollector Pickup any _xpath_ documentation and validate them within any website through [tag:google-chrome-devtools]. See the discussions: [this](https://stackoverflow.com/questions/62945647/why-xpath-does-not-highlighted-the-yellow-mark-in-chrome84/63073849#63073849), [this](https://stackoverflow.com/questions/62960908/chrome-84-inspect-element-find-results-not-highlighted-in-yellow-like-before/63075040#63075040) and [this](https://stackoverflow.com/questions/63034593/chrome-devtools-not-find-elements-not-search/63035359#63035359) – undetected Selenium Aug 20 '20 at 22:05

score 0 · Answer 4 · answered Aug 20 '20 at 12:52

0

I would search or get the tag of the "unique text" with js.

<script>
  // get the element
  let elem = document.getElementsByName('font');
</script>

https://www.w3schools.com/jsref/met_doc_getelementsbyname.asp

answered Aug 20 '20 at 12:52

Fl0r3

64
4

score -1 · Answer 5 · answered Aug 20 '20 at 13:00

-1

One more option for you:

//div[font='unique text']/div

answered Aug 20 '20 at 13:00

JaSON

4,843
2
8
15

How to locate a div with non unique id/class, which contains a div with a certain text and then fetch all the and tags under that div

5 Answers5

Solution