Reputation: 33
I have a HTML data like this.
<script type="application/ld+json">{ "name": "apple", "price": 100 }</script>
<script type="application/ld+json">{ "name": "banana", "price": 200 }</script>
<script type="application/ld+json">{ "name": "orange", "price": 300 }</script>
How can I scrape Json data which contains "banana" with Xpath.
For example, the javascript code below can scrape JSON containing banana. But it's just scraping only the second JSON.
const htmlString = res;
const doc = new DOMParser();
const string = doc.parseFromString(htmlString, 'text/html');
const result = string.evaluate('//script[@type="application/ld+json"]', string, null, 6, null);
const character = result.snapshotItem(2);
console.log(character);
In the code below, the variable is Null.
const htmlString = res;
const doc = new DOMParser();
const string = doc.parseFromString(htmlString, 'text/html');
const result = string.evaluate('//script[contains(text(), "banana")]', string, null, 6, null);
const character = result.snapshotItem(1);
console.log(character);
The image of the goal is { "name": "banana", "price": 200 } .
Upvotes: 0
Views: 693
Reputation: 24930
You can also get there with:
result = string.evaluate('//script[contains(text(), "banana")]/text()', string, null, 6, null),
character = result.snapshotItem(0).nodeValue;
console.log(character);
Upvotes: 1
Reputation: 177950
Why xpath?
const obj = [...document.querySelectorAll("script[type='application/ld+json']")]
.map(script => JSON.parse(script.textContent))
.filter((item)=>item.name==="banana")
console.log(obj[0])
<script type="application/ld+json">{ "name": "apple", "price": 100 }</script>
<script type="application/ld+json">{ "name": "banana", "price": 200 }</script>
<script type="application/ld+json">{ "name": "orange", "price": 300 }</script>
Upvotes: 1
Reputation: 66723
The index should be 0
, since you are targeting exactly which one you want.
const character = result.snapshotItem(0);
Upvotes: 1