javascript - 如何使用 Puppeteer 检查元素是否存在于 async/await 中

Question

我在检查元素是否存在后在页面上记录元素时遇到问题。我指的代码块在 "//phone" 注释下。

此代码循环遍历页面上的每个部分(section of sections)并记录“company”和“phone”。 “电话”可能不会出现在某些部分，所以我想我会通过一个 if 语句来检查它是否存在。这会产生一个错误 =“错误:找不到与选择器“.mn-contact-phone”匹配的元素”我该如何解决这个问题？

(async () => {
    try {
        const browser = await puppeteer.launch({ headless: true });
        const page = await browser.newPage();

        // loop through pages
        for (let pg = 1; pg < 5; pg++) {
            await page.goto("webpage");

            // record number of sections
            const sections = await page.$$("#mn-members-listings > div");

            // loop through each section
            for (const section of sections) {
                // company
                let company = await section.$eval(
                    "div.mn-searchlisting-title",
                    comp => comp.innerText
                );

                // phone --> THIS IF/ELSE THROWS AN ERROR
                if (section.$(".mn-contact-phone").length > 0) {
                    let phone = await section.$eval(".mn-contact-phone", phn => phn.innerText);
                } else {
                    let phone = "";
                }

                console.log(`Company = ${company} | Phone = ${phone}`);
            }
        }
        await browser.close();
    } catch (error) {
        console.log(`Our error is = ${error}`);
    }
})();

Answer 1

来自 puppeteer docs :

The method runs document.querySelector within the page. If no element matches the selector, the return value resolves to null.

1) null 没有长度。

2) ElementHandle.$ 返回一个 promise 。

将条件更改为:

if (await section.$(".mn-contact-phone"))

或者如果有多个元素:

if (await section.$$(".mn-contact-phone").length > 0)