Question

我的html文档是

<div class="inner-column">
 <div data-thing="abc1"></div>
 <div data-thing="abc2"></div>
 <div data-thing="abc3"></div>
</div>

如何在类为.inner-column的div中获取所有“数据”值（例如[“ abc1”，“ abc2”，“ abc3”]）？

const puppeteer = require('puppeteer');
const fs = require('fs');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  page.setViewport({width: 1440, height: 1200})
  await page.goto('https://www.example.com')

  const data = await page.content();

  await browser.close();
})();

Answer 1

您可以使用page.$$eval函数，例如：

data = [line for line in your_variable_here]

data = data[:2]

说明

const dataValues = await page.$$eval( '.inner-column div', divs => divs.map(div => div.dataset.thing) );函数的作用（引自上面链接的文档）：

此方法在页面中运行page.$$eval，并将其作为第一个参数传递给Array.from(document.querySelectorAll(selector))。

如果pageFunction返回了Promise，则pageFunction将等待该承诺解决并返回其值。

因此，它将首先查询目标div，然后使用dataset属性将div映射到其page.$$eval值。

Answer 2

您可以使用evaluate功能

const data = await page.evaluate(() => 
  Array.from(document.querySelectorAll(".inner-column DIV")).map(d => d.getAttribute("data-thing"))
)

Puppeteer获取所有数据属性值

2 个答案:

说明