如何查找没有具有特定 css 类的单元格的表行答案

【问题标题】：How to find table rows with no cells with a particular css class如何查找没有具有特定 css 类的单元格的表行
【发布时间】：2017-12-13 10:49:10
【问题描述】：

在试图帮助this question 的提问者时，我执行了一个与此问题的标题基本相同的谷歌搜索，但没有找到任何相关信息，例如，找到了following question 以查找 执行包含具有特定类的单元格。

尽管回答了上面提到的第一个问题，但我正在创建这个更狭窄的自我回答问答

希望下次有人搜索此内容时，Google 会将其编入索引，因为上面第一个引用的问题实际上是一个两部分的问题，这实际上是不可能的（在几秒钟内，这现在是 Google 的最高结果），和
为了提供问题的 jQuery 和非 jQuery 答案，第一个引用问题的 OP 显然没有使用 jQuery

那么，假设下面的 HTML 表格是页面上唯一的表格，如何使用 jQuery 或不使用 jQuery 找到没有任何单元格为 foo 类的表格行？

<table border="1">
  <tr><td class='foo'>foo</td><td></td><td></td></tr>
  <tr><td></td><td>bar</td><td></td></tr>
  <tr><td></td><td></td><td>baz</td></tr>
  <tr><td class="foo">foo</td><td>bar</td><td>baz</td></tr>
</table>

【问题讨论】：

标签： javascript jquery html html-table

【解决方案1】：

要查找具有具有特定 CSS 类的单元格的表格行，基本上您所要做的就是制作一个简单的选择器，例如$('tr:has(td.specialclass)') 来自对上述问题本身引用的第二个问题的回答。要查找包含特定类的 no 单元格的行，您可以更进一步并使用过滤器。

使用 jQuery：

let $nonFooRows = $('tr').filter((i, tr) => {
    return !$(tr).has('td.foo').length;
});

没有 jQuery：

let nonFooRows = [].filter.call(document.getElementsByTagName('tr'), (row) => {
    return !row.querySelector('td.foo');
});

我已经创建了上述每一项的演示，其中通过单击按钮将上面返回的行突出显示，这里：https://repl.it/@dexygen/FindRowsWithNoCellsHavingClassFoo

【讨论】：