• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

111
Vistas
Can't set id on img Tag using puppeteer

I am trying to set id's to all <img> tags of a page, my loop runs its iterations completely but some of the <img> tags doesn't get the id's as can be seen in the below image:

enter image description here

Here is my code:

const browser = await puppeteer.launch({
    args: [
        '--no-sandbox',
    ],
  });
  const page = await browser.newPage();
  await page.setViewport({ width: 1440, height: 10000 })
  await page.goto(url, {
        waitUntil: 'networkidle2',
        timeout: 0,
  });

await page.evaluate(() => {
const images = document.getElementsByTagName('img') || []
    for (let i = 0; i < images.length; i++) {
        document.getElementsByTagName('img')[i].id = `${i}`
        document.getElementsByTagName('img')[i].src = document.getElementsByTagName('img')[i].getAttribute('src')?.startsWith('https') ?
        document.getElementsByTagName('img')[i].getAttribute('src')! :
        `https://leza.notion.site${document.getElementsByTagName('img')[i].getAttribute('src')}`
    }
})

Am I missing anything? Any help would be highly appreciated!

I keep getting this warning log

PAGE LOG: %c NOTION%c WARNING %c background: black; color: white; background: black; color: orange font-weight: normal Reverting mutation of attribute src from "/image/https%3A%2F%2Fraw.githubusercontent.com%2Feirikmadland%2Fnotion-icons%2Fmaster%2Fv5%2Ficon3%2Ful-file-search-alt.svg?table=block&id=db9359ba-4fcd-4a24-9744-8514d7810939&userId=&cache=v2" -> "https://leza.notion.site/image/https%3A%2F%2Fraw.githubusercontent.com%2Feirikmadland%2Fnotion-icons%2Fmaster%2Fv5%2Ficon3%2Ful-file-search-alt.svg?table=block&id=db9359ba-4fcd-4a24-9744-8514d7810939&userId=&cache=v2" in component  JSHandle@object
about 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Instead of

await page.evaluate(() => {
    const images = document.getElementsByTagName('img') || []

try using:

await page.$eval('.img', (images) => { /* DO STUFF... */ });

So the following code should work:

await page.$eval('.img', (images) => {
    for (let i = 0; i < images.length; i++) {
        const currentImage = images[i];
        const targetImageId = `${i}`;
        const currentImageSrc = currentImage.getAttribute('src');
        const targetImageSrc = currentImageSrc?.startsWith('https')
            ? currentImageSrc!
            : `https://leza.notion.site${currentImageSrc}`;

        currentImage.setAttribute("id", targetImageId);
        currentImage.setAttribute("src", targetImageSrc);
    }
});

Note that your url will look something like the following, which are probably not correct URLs for the two 1st ones:

<img src="http://www.gravatar.com/avatar/8947787d4067fa6e66e485bfc72233e4?s=48&amp;d=identicon&amp;r=PG&amp;f=1">
https://leza.notion.sitehttp://www.gravatar.com/avatar/8947787d4067fa6e66e485bfc72233e4?s=48&d=identicon&r=PG&f=1

or

<img src="image.png">
https://leza.notion.sitemyimage.png

or

<img src="/image.png">
https://leza.notion.sitemy/image.png
about 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda