如何隱藏不包含特定圖標的表的行

Question

我有一個包含一些項目的表格，可以通過添加對勾來選擇那些項目。 檢查附件中的圖像：

我需要實現的是隱藏不包含任何不可見刻度的行。 這是因為在我的應用程序中，我必須生成項目列表，其中僅包含另一個視圖中的刻度。 因此，當我按下“生成”按鈕時，該行將被隱藏。 我只想說，當我將使用這些項目列表生成視圖時，是否該行不包含任何“ 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頁面，有關創建“最小，完整和可驗證的示例”，但我認為，進行復習將有助於改善您的StackOverflow體驗（對於我來說，它驗證了我對“分而治之”）。

我認為所有這些都使您難以獲得所需的幫助。 在下面的任何情況下，我都將為示例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'});