javascript - 删除所有 <tr> 如果文本中不包含 "test"

Question

我是第一次制作 Chrome 扩展，需要一些有关 Javascript 的帮助。

在我的弹出菜单中，我想要一些按钮。一旦有人按下此按钮，我们就说按钮“测试”。我希望它删除每一个 <tr>谁不包含单词 "test" 。

我这样做是因为我经常使用的这个网站上的过滤功能非常慢。这样我就可以通过删除行来更快地过滤，而不是让程序搜索所有行。

这是我到目前为止所拥有的:

var searchString = 'TEST';
$("#tbody tr td:contains('" + searchString + "')").each(function Tester() {
  if ($(this).text() != searchString) {
    $(this).parent().remove();
  }
});

<p>Remove all rows which don't contain:</p>
<button onclick="Tester()">TEST</button>

Answer 1

首先不要使用内联JS。这是不好的做法。使用不显眼的 JS 附加事件处理程序。

要解决您的实际问题，请使用 :contains 选择器和 remove()，如下所示:

$('button').click(function() {
  var searchString = $(this).text();
  $("#tbody tr td:contains('" + searchString + "')").closest('tr').remove();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Remove all rows which don't contain:</p>
<button>TEST</button>

<table>
  <tbody id="tbody">
    <tr>
      <td>TEST</td>
    </tr>
    <tr>
      <td>Foo</td>
    </tr>
    <tr>
      <td>TEST</td>
    </tr>
    <tr>
      <td>Bar</td>
    </tr>
  </tbody>
</table>