Question

我正在尝试从保存HTML数据的变量中抓取HTML数据。您可以看到我的注释，它们带有“ <<”标记。不幸的是，evaluate仅适用于div上的页面。有人可以告诉我如何从包含HTML的变量中抓取信息吗？

也许还有其他刮刮方法吗？

我也在forEach循环中尝试过，但这导致了原始文档的第一个mealname。

let mealName = htmlOfOneProduct.document.querySelector("div.meal__description-texts.js-meal-description-text > span > span").innerText;

带注释的代码：

const puppeteer = require('puppeteer');
function run () {
    return new Promise(async (resolve, reject) => {
        try {
            const browser = await puppeteer.launch();
            const page = await browser.newPage();
            await page.goto(" "); << Meal website
            let urls = await page.evaluate(() => {
                let results = [];
                let items = document.querySelectorAll('div.meal__wrapper'); << Gets all the meals from a page
                items.forEach((item) => {
                    let htmlOfOneProduct = item.innerHTML; << Gets the HTML of each meal

                    let mealName = htmlOfOne.evaluate(() => document.querySelector('meal-name').textContent); << Not working, should get the meal-name from the div.

                    results.push({
                        mealName: mealName
                    });
                });
                return results;
            })
            browser.close();
            return resolve(urls);
        } catch (e) {
            return reject(e);
        }
    })
}
run().then(console.log).catch(console.error);

Answer 1

由于您未提供网站网址，对不起，我无法检查我的建议。

item.innerHTML返回一个没有evaluate()方法的字符串。试试这种更简单的方法：

                items.forEach((item) => {
                    let mealName = item.querySelector('meal-name').textContent;
                    results.push({
                        mealName: mealName
                    });
                });

Answer 2

也许[ { "key": "ctrl+shift+.", "command": "type", "args": { "text": "⟩" } }, { "key": "ctrl+shift+,", "command": "type", "args": { "text": "⟨" } } ]是不必要的。

如果只需要某些内容，则可以直接进行let htmlOfOneProduct = item.innerHTML; << Gets the HTML of each meal或item.innerText或该元素的任何其他适当的操作。

最后应该可以这样：

item.name

Answer 3

您还可以结合使用CSS选择器，并使用Array.from()简化元素innerText的抓取：

let urls = await page.evaluate(() => {
  return Array.from(document.querySelectorAll('div.meal__wrapper span.meal-name'), e => ({
    mealName: e.innerText,
  });
});

JavaScript操纵符抓取变量

3 个答案: