如何隐藏不包含特定图标的表格行

Question

我有一个包含一些项目的表格，可以通过添加勾选来选择这些项目。检查附件图片：

我需要实现的是隐藏不包含任何刻度的行不可见。这是因为在我的应用程序中，我必须生成仅包含另一个视图中的刻度的项目列表。因此，当我按下生成按钮时，该行将被隐藏。 我只是想说这行是否包含任何＆＃39; glyphicon-ok＆＃39;当我使用这些项目列表生成视图时，需要删除/隐藏。

我试过这样的事情：

SveCrf.prototype.hideRowWhereNoTicksForm = function () {
    var tr = document.getElementsByTagName('tr');

    for (var i = 0; i < tr.length; i++) {
        switch (tr.item(i).getElementsByTagName('td').item(0).className) {
            case "glyphicon-ok":
                tr.item(i).style.display = "none";
                break;
        }
    }
}

这没有做任何事情。 我想看一个能够解决这个问题的例子。

Answer 1

如果我错了，请告诉我，但您似乎没有提供您想要采取行动的HTML，而只是在生成HTML的评论中提供屏幕截图和指向某些RoR代码的链接。此外，您还没有显示您尝试执行SveCrf.prototype.hideRowWhereNoTicksForm的方式，而且我完全不确定您要对switch/case执行什么操作（我也不知道＆＃39;}了解item应该是什么;这是为我们提供实际HTML可能有帮助的地方。

此外，正如我在我的一些评论中提到的那样，你真的想做两件事。我不知道你是否已经看过这个关于creating "a Minimal, Complete, and Verifiable example"的Stackoverflow页面，但我认为审查这将有助于改善你的StackOverflow体验（同时对我而言，它验证了我对＃34的建议）分而治之的＆＃34;）。

我认为所有这些都让你难以得到你想要的帮助。在下面的任何情况下，我都提供一些示例HTML，其中包含一个总共包含四行的表格，两个包含一个包含类foo的单元格，另外两个包含不包含类别的单元格。在其下面是我的非jQuery代码，选择没有包含类foo的单元格的行，然后隐藏它们;此外，在https://repl.it/@dexygen/HideRowsWithNoCellsWithClass

使用jQuery进行了相同功能的演示

<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>

/*
We cannot call `filter` directly on an HTMLCollection such as returned by 
"document.getElementsByTagName('tr')" as it is not a bona fide array, so we use 
"[].filter.call()", and we return only those rows that *fail* the test 
"row.querySelector('td.foo')", then we loop over these with `forEach` and hide them
*/

[].filter.call(document.getElementsByTagName('tr'), function(row) {
    return !row.querySelector('td.foo');
}).forEach(function(row) {row.style.display = 'none'});