当您使用 .html() 删除元素时，jQuery 中的事件侦听器是否会自动删除？

Question

在 jQuery 中，如果我们使用 .remove() 来删除某个元素，那么与该元素关联的所有绑定事件和 jQuery 数据都会被删除。

但是如果我们用 .html()“删除”元素会发生什么？

我们是否需要在更改任何 html 之前取消绑定所有元素以避免内存泄漏？

Answer 1

是的，它们将被删除。 jQuery 将清理与已删除元素相关的事件等。如果您执行类似 $(elm1).html($elm2.html()) 的操作，它不会复制事件

Answer 2

是的，即使您使用 html()，它们也会被删除。 jQuery 源代码证实了这一点。

Answer 3

只是扩展一下：

• .remove()，.html()，.empty() 等 - 全部删除侦听器
• .detach() 不删除侦听器
• .clone() 有参数让您决定是否复制数据/侦听器

因此，如果您想保留侦听器，请使用.detach()。

Answer 4

是的，最好移动元素，您不需要将它们丢失到另一个显示无容器，但使用 JavaScript appendChild 方法，因为它不复制元素，它只是将元素从一个容器发送到另一个容器，这样您就不会丢失事件听众这样。

前任

<div id="hidden_container" style="display:none;"></div>
<script>
  $("#hidden_container").get(0).appendChild("#elm_with_event").get(0));
</script>