在 Puppeteer 中排除具有某些 类 的元素

Question

我试图用 Puppeteer 解析的 HTML 看起来像这样：

<ul>
    <li class="title"> item 1 </li>
    <li class="title hide"> item 1 </li>
</ul>

我正在像这样访问 li 元素：

await page.$$eval("ul > li.title", nodes =>
    nodes.map(element => {
      return {
        //some attributes
      };
    })
  );

扩展的结果是只检索没有class=hide的元素。不幸的是 hide 是除 title 之外的 class，它由所有 <li> 元素共享。

如何重构 Puppeteer 代码以排除具有 hide class 的元素？

Answer 1

只需将 :not(.hide) 添加到您的选择器字符串中：

page.$$eval("ul > li.title:not(.hide)", nodes =>

Answer 2

:不(.隐藏)

您应该使用 :not() CSS 伪 class 到 select 不包含 class .hide 的元素：

await page.$$eval('ul > li.title:not(.hide)', nodes =>
  nodes.map(element => {
    return {
      // some attributes
    };
  })
);

.filter(e => !e.matches('.hide'))

另一方面，您还可以 filter() your nodes to only include the elements that are not matches() 的 .hide select 或字符串：

await page.$$eval('ul > li.title', nodes =>
  nodes.filter(e => !e.matches('.hide')).map(element => {
    return {
      // some attributes
    };
  })
);