(注意:我在下面使用jQuery,但问题实际上是一般的Javascript问题.)
假设我有一个div#formsection使用AJAX反复更新其内容的内容,如下所示:
var formSection = $('div#formsection');
var newContents = $.get(/* URL for next section */);
formSection.html(newContents);
Run Code Online (Sandbox Code Playgroud)
每当我更新这个div时,我会触发一个自定义事件,它将事件处理程序绑定到一些新添加的元素,如下所示:
// When the first section of the form is loaded, this runs...
formSection.find('select#phonenumber').change(function(){/* stuff */});
...
// ... when the second section of the form is loaded, this runs...
formSection.find('input#foo').focus(function(){/* stuff */});
Run Code Online (Sandbox Code Playgroud)
所以:我将事件处理程序绑定到某些DOM节点,然后删除这些DOM节点并插入新节点(html()这样做)并将事件处理程序绑定到新的DOM节点.
我的事件处理程序是否与它们绑定的DOM节点一起被删除?换句话说,当我加载新的部分时,很多无用的事件处理程序堆积在浏览器内存中,等待不再存在的DOM节点上的事件,或者当它们的DOM节点被删除时它们被清除了吗?
奖金问题:如何自己测试?