javascript - 使用 Puppeteer 选择 href 属性

Question

我正在尝试从 this 中提取一些 url带有 Puppeteer 的页面。

但是我返回的所有脚本都是undefined

const puppeteer = require('puppeteer');

async function run() {

    const browser = await puppeteer.launch({args: ['--no-sandbox', '--disable-setuid-sandbox']});

    const page = await browser.newPage();

    await page.goto('https://divisare.com/');


    let projects = await page.evaluate((sel) => {

        return document.getElementsByClassName(sel)
    }, 'homepage-project-image');


    var aNode = projects[0].href;

    console.log(aNode);
    console.log(projects.length)



  browser.close();

}
run();

但是，当我运行如下所示的程序时，我至少能够获得我尝试提取的链接的正确计数。

let projects = await page.evaluate((sel) => {

    return document.getElementsByClassName(sel).length
}, 'homepage-project-image');


console.log(projects);

我是否试图错误地访问我的 projects HTMLCollection？我在这里错过了什么？谢谢。

Answer 1

Puppeteer 无法从 evaluate 语句返回不可序列化的值(参见 this issue 和以下 PR )

解决这个问题的一种方法是:

let projects = await page.evaluate((sel) => {

        return document.getElementsByClassName(sel)[0].href;
    }, 'homepage-project-image');

请记住，document.getElementsByClassName 返回 HTMLCollection，因此如果您想遍历结果，您需要类似以下内容:

 let projects = await page.evaluate((sel) => {
            return Array.from(document.getElementsByClassName(sel)).map(node => node.href);
        }, 'homepage-project-image');