Puppeteer

Question

我正在尝试获取此页面上 div“Notes et références”中的所有链接：

https://fr.wikipedia.org/wiki/Barack_Obama

但我似乎没有合适的选择器。我试过了，但没用：

const scrollable_section = '#mw-content-text > div.mw-parser-output > div.reference-cadre'
await page.evaluate(selector => {
    const element = document.querySelector(selector);
    element.scrollTop = element.offsetHeight;
}, scrollable_section);

有人可以帮助我吗？

我是 Puppeteer 的新手，所以我可能需要更多解释。

Answer 1

元素可滚动并不意味着您实际上需要滚动才能获取数据。它通常仅适用于需要处理滚动的 JS 驱动的动态提要。

在这种情况下，数据是静态可用的，因此除非您出于其他原因使用 Puppeteer，否则您可以使用更简单且可能更快的 Axios/Cheerio 组合来完成此操作。

更好的方法是使用维基百科的 API 而不是抓取数据。如果你抓取，请尊重他们对机器人的限制。

继续使用 Puppeteer，维基百科具有不嵌套部分的奇怪页面结构。选择 #Notes_et_références 后，您可以弹出到父节点 <h2>，然后向前迭代几个兄弟节点，直到到达 .reference-cadre 元素（我硬编码了这种关系，但您可以如果目标是面向未来，请使用循环使其更具动态性）。

const puppeteer = require("puppeteer");

let browser;
(async () => {
  browser = await puppeteer.launch({headless: true});
  const [page] = await browser.pages();
  const url = "https://fr.wikipedia.org/wiki/Barack_Obama";
  await page.goto(url);
  const links = await page.evaluate(() =>
    [...document.querySelector("#Notes_et_références")
      .parentNode
      .nextElementSibling
      .nextElementSibling
      .querySelectorAll("a")]
      .map(e => e.getAttribute("href"))
  );
  console.log(links.length, links.slice(0, 5));
})()
  .catch(err => console.error(err))
  .finally(() => browser?.close())
;

输出：

809 [
  '#cite_ref-prononciation_1-0',
  '#cite_ref-prononciation_1-1',
  '/wiki/Prononciation_de_l%27anglais',
  '/wiki/Anglais_am%C3%A9ricain',
  '/wiki/Transcription_phon%C3%A9tique'
]

Puppeteer - 滚动到 div 的底部

Puppeteer - Scroll to the bottom of a div

javascript

scroll

node.js

web-scraping