jQuery remove()过滤被删除的元素（推荐）

简介

jQuery remove() 方法用于删除 HTML 元素。该方法也可以移除事件处理程序和数据。

remove() 方法会保留被删除的元素的数据和事件处理程序，因此这些被删除的元素可以在需要时再次插入到 DOM 中。

同时，remove() 方法还提供了过滤被删除的元素的功能，这样可以更方便的操作被删除的元素。

语法

$(selector).remove(filter)

参数说明：

• selector：必须，用于筛选需要删除的元素的选择器表达式；
• filter：可选，用于过滤被删除的元素的选择器表达式。

过滤被删除的元素

remove() 方法可以接受一个选择器表达式作为参数，用于筛选需要删除的元素。

同时，remove() 方法还可以接受一个过滤器（filter）作为参数，用于过滤被删除的元素。

例如，我们可以使用以下代码来删除类名为 red 的元素，并过滤出被删除的元素：

<p class="red">要删除的红色元素</p><p>不是要删除的元素</p><p class="red">要删除的红色元素</p><p>不是要删除的元素</p><script>// 删除类名为 red 的元素，过滤出被删除的元素var removedElement = $('p.red').remove('.red');console.log(removedElement);</script>

执行以上代码，可得到以下结果：

[<p class="red">要删除的红色元素</p>, <p class="red">要删除的红色元素</p>]

可以看出，返回了被删除的两个类名为 red 的元素。

示例：删除表格行并过滤被删除的行

我们可以使用 remove() 方法来删除表格中的某一行，并过滤出被删除的行。

以下是示例代码：

<table id="myTable">  <tr><td>第一行</td></tr>  <tr><td>第二行</td></tr>  <tr><td>第三行</td></tr></table><script>// 点击按钮删除第二行，并过滤出被删除的行$('button').click(function() {  var removedRow = $('#myTable tr:eq(1)').remove();  console.log(removedRow);});</script>

上述代码中，我们绑定了一个点击事件，当点击按钮时，删除表格中的第二行，并过滤出被删除的行。

执行以上代码，并点击按钮后，可得到以下结果：

[<tr><td>第二行</td></tr>]

可以看出，返回了被删除的第二行元素。

总结

remove() 方法提供了过滤被删除的元素的功能，可以更方便的操作被删除的元素。我们可以通过筛选还是过滤的方式来指定需要删除的元素。

需要注意的是，remove() 方法会保留被删除的元素的数据和事件处理程序，因此这些被删除的元素可以在需要时再次插入到 DOM 中。