如何使用 Puppeteer 获取指定元素

Question

一个页面有两个

元素：

<div class='class1'>...</div>

<div class='class1 class2'>...</div>

请使用以下代码：

let result = await page.$$eval('div.class1', nodes => {...})

获取上面两种div，但我只想获取class='class1'的div。 我该如何做到这一点？

- marslord

---

你想要仅第一个元素吗？还是所有 class="class1" 的元素？ - hretic

我想要所有元素的class="class1" && class != 'class2'，并且以下问题已经解决，谢谢@Vaviloff - marslord

Answer 1

根据文档，page.$$eval 使用 document.querySelectorAll 查找传递的选择器所匹配的元素，因此我们可以告诉它不要检索 class2 ：

let result = await page.$$eval('div.class1:not(.class2)', nodes => {...})

但显然这不是一个可扩展的方法：你需要跟踪所有其他不应被选择的类，并不断更新代码。

最好只过滤那些具有完全必要类名的节点。

let result = await page.$$eval('.class1', nodes => 
    nodes.filter(node => node.className === "class1").map(node => node.textContent)
);

请注意，我们不必在这里将nodeList转换为数组（例如使用[...nodes]或Array.from(nodes)），可以直接使用filter和map。这是因为page.$$eval方便地为我们执行了此操作。

- Vaviloff

---

谢谢你的回答，它有效了，我从你的回答中学到了更多知识！ - marslord