Question

假设我有一个内部有各种元素的容器。反过来，任何元素都可以有各种事件监听器。

<div id="container">
   <video src="movie.mp4"></video>
   <a>Some button</a>
</div>

使用Prototype JS，如何从内存中正确删除每个元素及其事件侦听器？以下是清理所有内容的明确方法：

$('container').childElements().each(
   function(child) {
      Event.stopObserving(child);
      child.remove();
   }
);

以下是清除容器的更快捷的方法：

$('container').update();

但它会导致内存泄漏吗？大多数javascript引擎会理解如果我清除innerHTML，我还想清除每个元素上的事件监听器吗？

Answer 1

通常，当元素消失时，事件处理程序将消失。清除容器的innerHTML会破坏所有包含的元素，从而破坏附加的事件处理程序。

旧版本的Internet Explorer（＆lt; = IE8）在拥有元素被销毁时从事件处理程序重新声明内存时出现问题。为了适应它们，您应该使用Event.stopObserving。

要绝对确定，您可以像这样扩展Element：

Element.addMethods({
    clear: function(element) {
        element = $(element);

        element.descendants().each(function(elem) {
            Event.stopObserving(elem);
        });

        return element.update();
    }
});

在重新设置元素内容本身之前，这会从所有后代中删除所有事件。它似乎不是Event.stopObserving()本身就是重复的，所以如果没有这一步，可能仍然存在“进一步向下”的元素泄漏。像这样使用它：

$('container').clear();

See this as a jsFiddle.

免责声明：我对原型不熟悉。如果上述内容不正确，请发表评论。

如何在Prototype JS中干净地删除DOM元素？

2 个答案: