Dinu Duke
Dinu Duke

Reputation: 185

Exracting data/value of given xpath in JavaScript

I am able to extract the xpath of any element present in document but not able to extract its contents/value/data. for example :

<div class="container" title="DivA">
DivA
<div id="container" title="#DivB">
    #DivB
    <div title="DivC (div)">
        DivC (div)
    </div>
    <span title="SpanD (span)">
        SpanD (span)
        <ul>
            <li title="Bullet 1">Bullet 1</li>
            <li id="bullet2" title="Bullet 2">Bullet 2 (#bullet2)</li>
            <li title="Bullet 3">Bullet 3</li>
        </ul>
    </span>
          <img src="favicon.ico">
         <a href="http://google.com/">Dummy Href</a>
</div>

i need the content which is in between tags for example:
var path = //*[@id='container']/span1/ul1/li[3]; //path for Bullet 3
var data = path.value // or any thing which can help to extract data.
var data will be Bullet 3

xpath extraction screenshot: Xpath for image without @src

Upvotes: 2

Views: 1880

Answers (1)

Z-Bone
Z-Bone

Reputation: 1584

You can use document.evaluate to accomplish this..

Like this:

var li = document.evaluate( "//*[@id='container']/span[1]/ul[1]/li[1]", document, null, XPathResult.STRING_TYPE, null);
var a = document.evaluate("//*[@id='container']/span[1]/a/@href",document, null, XPathResult.STRING_TYPE, null);
console.log(li.stringValue);
console.log(a.stringValue);
<div class="container" title="DivA">
DivA
<div id="container" title="#DivB">
    #DivB
    <div title="DivC (div)">
        DivC (div)
    </div>
    <span title="SpanD (span)">
        SpanD (span)
        <a href="https://google.com">Google</a>
        <ul>
            <li title="Bullet 1">Bullet 1</li>
            <li id="bullet2" title="Bullet 2">Bullet 2 (#bullet2)</li>
            <li title="Bullet 3">Bullet 3</li>
        </ul>
    </span>
</div>

Upvotes: 6

Related Questions