Puppeteer爬虫：如何定位指定src的图片标签并点击？

代码问题根源 #

你当前代码里的page.evaluate回调函数没有return语句，所以返回值为undefined，这就是控制台输出undefined的原因。

正确实现方式（两种可选） #

方法一：直接用属性选择器定位并点击

利用CSS属性选择器直接匹配src为assets/images/2.svg的图片，无需遍历所有图片：

import puppeteer from "puppeteer";

async function scrap() {
  const browser = await puppeteer.launch({
    headless: true,
  });
  const page = await browser.newPage();
  // 合并页面加载配置，减少冗余等待
  await page.goto("https://www.labforme.com/Login/", {
    waitUntil: 'networkidle0',
  });

  // 等待目标图片加载完成
  await page.waitForSelector('img[src="assets/images/2.svg"]');
  // 点击目标图片
  await page.click('img[src="assets/images/2.svg"]');

  // 可选：添加模态框加载等待逻辑，替换为实际模态框选择器
  // await page.waitForSelector('.your-modal-selector');

  await browser.close();
}
scrap()

方法二：在浏览器上下文内查找并点击

如果需要在页面环境内做额外判断，可以用page.evaluate处理：

import puppeteer from "puppeteer";

async function scrap() {
  const browser = await puppeteer.launch({
    headless: true,
  });
  const page = await browser.newPage();
  await page.goto("https://www.labforme.com/Login/", {
    waitUntil: 'networkidle0',
  });

  await page.evaluate(() => {
    // 精准定位目标图片
    const targetImg = document.querySelector('img[src="assets/images/2.svg"]');
    if (targetImg) {
      targetImg.click();
    }
  });

  await browser.close();
}
scrap()

额外提示 #

• 注意src属性的路径类型：如果页面里是绝对路径，需要把选择器中的路径改为完整URL，比如img[src="https://www.labforme.com/assets/images/2.svg"]
• 若图片为动态加载，可替换waitForSelector为waitForFunction，确保图片真正渲染完成

内容的提问来源于stack exchange，提问作者Sarmed MQ Berwari