Puppeteer: How get img src inside nested selector?

Viewed 94

I have a structure like this:

<div class="loaded active">
<img class="full" src="img1.jpg">
</div>

<div class="loaded">
<img class="full" src="img2.jpg">
</div>

<div class="loaded">
<img class="full" src="img3.jpg">
</div>

I need get link of img1.jpg. I can get links for class="full":

const slkImg = '.full';
    
const imgs = await page.$$eval(slkImg, postLinks => postLinks.map(link => link.src));

but I don't know how do it for only img1.jpg.

1 Answers

As discussed in the comments,

page.$eval('.loaded.active .full', el => el.src)

works thanks to two things:

  1. Using $eval rather than $$eval to select one element
  2. Using .loaded.active .full to select the first .full descendent of the first .loading.active parent.
Related