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

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

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

我试过这样的事情：

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做什么（我也不明白应该是什么item ） ;这是为我们提供实际HTML可能有帮助的地方）。

另外，正如我在我的一些评论中所提到的，你真的想做两件事。 我不知道你是否已经看到这个Stackoverflow页面还有关于创建“一个最小的，完整的，可validation的例子”但我认为审查这将有助于改善你的StackOverflow体验向前发展（同时对我而言，它validation了我的建议“分而治之“”。

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

 
 
foo
 
bar
 
baz
 
foo
bar
baz
 
 /* 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'});