Javascript 根据其他行中的内容筛选HTML表行

我的HTML网站中有一个表，我有效地使用它作为列表来显示项目

每个项目都有：

• 列[0]中的图像
• 第[1]列中的名称
• 第[2]列中的说明

但比这稍微复杂一点，列[0]和[2]有一个

行span=“2”

，每个项目在表中有第二行，在列[1]的名称下面显示两个类别

这意味着它最终看起来像这样：-

我希望在我的网站上的某个地方，默认情况下，没有勾选复选框，所有项目都显示出来。勾选复选框后，我希望隐藏所有未将复选框内容作为其类别之一的项目

我在stackoverflow上发现了类似的问题，它们做了类似的事情，但它们对我不起作用，因为在我的情况下，我需要每隔一行检查一次，如果没有找到匹配项，则需要隐藏该行及其上方的一行

---

谢谢。

如果您的复选框看起来像这样：

<div>
  <input type="checkbox" name="categories" value="CATEGORY1"> Category One<br>
  <input type="checkbox" name="categories" value="CATEGORY2"> Category Two<br>
  <input type="checkbox" name="categories" value="CATEGORY3"> Category Three<br>
  <input type="checkbox" name="categories" value="CATEGORY4"> Category Four <br>
</div>

此解决方案在取消选中复选框时不处理隐藏行的撤消，但这相当简单

以下是更新的小提琴的链接：

我希望这有帮助

编辑：我没有仔细阅读你的问题

---

如果要隐藏所有不包含该类别的行，只要在IndexOf（）复选框中将>更改为==，如果您的复选框如下所示：

<div>
  <input type="checkbox" name="categories" value="CATEGORY1"> Category One<br>
  <input type="checkbox" name="categories" value="CATEGORY2"> Category Two<br>
  <input type="checkbox" name="categories" value="CATEGORY3"> Category Three<br>
  <input type="checkbox" name="categories" value="CATEGORY4"> Category Four <br>
</div>

此解决方案在取消选中复选框时不处理隐藏行的撤消，但这相当简单

以下是更新的小提琴的链接：

我希望这有帮助

编辑：我没有仔细阅读你的问题

如果要隐藏所有不包含该类别的行，只需在IndexOf（）检查中将>更改为==