CODEWITHSUNDEEP
javascriptnode.jscss-selectorspuppeteer
Lokomotywa
Lokomotywa

Reputation: 2844

Puppeteer Query Selectors - how to get second match

<table><tr><td>firstContent</td><td>secondContent</td></tr></table>

Querying this table with puppeteer's page.$eval I retrieve firstContent. How would I retrieve secondContent?

const value = await page.$eval('table tr td', el => { return el.innerHTML });

Upvotes: 5

Views: 17308

Answers (2)

Ekeuwei
Ekeuwei

Reputation: 281

page.$eval runs document.querySelector within the page and return the first match to the selector if you want to access other elements matching your selector use page.$$eval which runs document.querySelectorAll and returns an array of all matched elements.

An example case to retrieve the second element would be:

const second_value = await page.$$eval('table tr td', el => el[1].innerHTML);

Upvotes: 2

Thomas Dondorf
Thomas Dondorf

Reputation: 25280

You can use :nth-child like this:

const value = await page.$eval('table tr td:nth-child(2)', el => { return el.innerHTML });

For more complex expressions, you could also make use of the document.querySelectorAll function within the page.evaluate and then choose the second element like this:

const value = await page.evaluate(
    () => document.querySelectorAll('table tr td')[1].innerHTML
);

Upvotes: 15

Related Questions