Javascript 为什么我在抓取时会得到重复的数据？

我想学习一些网页抓取和我发现了木偶图书馆。我选择木偶师而不是其他工具，因为我有一些JS方面的背景

我还发现了这个，它的目的是被刮去。我设法得到了每一页每一本书的信息。以下是我所做的：

(async () => {
  const browser = await puppeteer.launch({headless: false});
  const page = await browser.newPage();
  await page.goto(url); // http://books.toscrape.com/

  const json = [];

  let next = await page.$('.pager .next a'); // next button

  while (next) {
    // get all articles
    let articles = await page.$$('.product_pod a');

    // click on each, get data and go back
    for (let index = 0; index < articles.length; index++) {
      await Promise.all([
        page.waitForNavigation(),
        articles[index].click(),
      ]);
      const data = await page.evaluate(getData);
      json.push(data);
      await page.goBack();
      articles = await page.$$('.product_pod a');
    }

    // click the next button
    await Promise.all([
      page.waitForNavigation(),
      page.click('.pager .next a'),
    ]);

    // get the new next button
    next = await page.$('.pager .next a');
  }
  fs.writeFileSync(file, JSON.stringify(json), 'utf8');
  await browser.close();
})();

---

当我最终执行脚本时，除了在最终的

json

文件中有重复的记录外，一切都进行得很顺利。也就是说，每本书在文件中都有两个条目。我知道脚本可能会更好，但您认为这种方法会发生什么情况？

您在这行中的选择器：

let articles = await page.$$('.product_pod a');

匹配的数量超过所需数量。您将得到40而不是20（

a

图像容器的子标记也包括在内，它们与h3的子

a

相同）

您希望限制为

h3 a

：

let articles = await page.$$('.product_pod h3 a');

---

从来没有想过除了那些元素是什么之外，我还匹配了多少元素。在这条道路上还有一件事需要学习。非常感谢你。

let articles = await page.$$('.product_pod h3 a');