Question

我正在尝试在Bing图片搜索中为搜索词获取所有图片的src值。我正在使用p。我写了一个选择器来抓取每个图像标签，它可以在Chrome DevTools中使用。但是，当我在代码中编写它时，它不起作用-

const puppeteer = require("puppeteer");

(async () => {
    try{
        let url = `https://www.bing.com/images/search?q=cannabis`
        const browser = await puppeteer.launch({headless: false})
        const page = await browser.newPage()
        await page.goto(url)
        await page.waitForSelector("ul.dgControl_list li img.mimg")

        console.log(await page.evaluate(() => {
            Array.from(document.querySelectorAll("ul.dgControl_list>li img.mimg"), img => img.src)
        }))
    } catch(err){
        console.log("error - " + err)
    }
})()

我在devTools中将输出作为一个对象包含10个项目的数组，但是当我通过代码在控制台中运行它时，它是未定义的。如何阅读该对象？

Answer 1

您没有从page.evaluate调用返回任何数据。要返回数据，您必须使用return语句或使用简短语法（如下所述）：

console.log(await page.evaluate(() => {
    return Array.from(document.querySelectorAll("ul.dgControl_list>li img.mimg"), img => img.src)
}))

说明：箭头功能

箭头功能有两种写法。一种是简短的语法，您可以像这样使用它：

const func = () => 1; // func() will simply return 1

您只能在其中放置一个语句（尽管它可能会调用其他语句）。另外，您可以使用长格式：

const func = () => { return 1; }; // Same function as above

您可以在此函数内使用变量声明和任何类型的代码（就像在普通的function() { ... }中一样，但是这次您必须使用return返回值。

因此，作为替代，您也可以编写以下代码（简短语法）：

console.log(await page.evaluate(
    () => Array.from(document.querySelectorAll("ul.dgControl_list>li img.mimg"), img => img.src)
))

Page.evaluate（）返回未定义，但该语句在Chrome devTools中有效

1 个答案:

说明：箭头功能