javascript - 使用 Puppeteer 在网站中查找最大的图像

标签 javascript node.js puppeteer cheerio

我正在使用 Cheerio在网页中找到最大的图像。这是我使用的代码:

  const { src } = $('img')
      .map((i, el) => ({
        src: el.attribs.src,
        width: el.attribs.width ? Number(el.attribs.width.match(/\d+/)[0]) : -1,
      }))
      .toArray()
      .reduce((prev, current) => (prev.width > current.width ? prev : current));

但是,只有当 width 是内联的 img 时,它才有效。如果没有宽度,我会将其宽度设置为 -1 并在排序时考虑它

有没有办法在没有这些技巧的情况下使用 Puppeteer 在网页中找到最大的图像?由于浏览器正在渲染所有这些,它可以很容易地找出哪个是最大的

最佳答案

您可以使用 page.evaluate()在页面 DOM 上下文中执行 JavaScript,并将最大图像的 src 属性返回给 Node/Puppeteer:

const largest_image = await page.evaluate(() => {
  return [...document.getElementsByTagName('img')].sort((a, b) => b.naturalWidth * b.naturalHeight - a.naturalWidth * a.naturalHeight)[0].src;
});

console.log(largest_image);

关于javascript - 使用 Puppeteer 在网站中查找最大的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52206725/

相关文章:

javascript - 工具提示在 lineChart Nvd3.js 中的错误位置?

javascript - 如何让外部函数(在 javascript 中)调用 html 中的 ID?

node.js - 如何在 multer 中捕获错误

node.js - 文件选择器有问题。文件选择器处理不适用于同一页面的多个连接

selenium-chromedriver - puppeteer 操纵者在点击事件后识别元素内容

javascript - 如何从 JavaScript 中的 JSON 字符串获取特定值?

javascript - 移动到顶部的垂直导航栏

node.js - Windows 上 npm 模块的全局安装

node.js - 如何使用 sequelize 删除唯一选项

javascript - 如何在 puppeteer 中等待选择器,但仅等待特定时间段?