javascript - 移除一个元素是否也会移除它的事件监听器？

Question

如果您还使用removeChild()?删除元素，则删除与项目关联的事件。即使使用简单的this.innerHTML =''? 这同样适用于与这样的内联元素关联的事件<div onclick="/*this event*/"> </div>？提前致谢。

Answer 1

答案是，这取决于您是否引用了它。

var d = document.createElement('div');
otherElement.appendChild(d);
otherElement.removeChild(d);
// still have reference to d, it will exist, event listener remains even if it won't be fired.

如果您无法再访问它，则该元素将与侦听器一起被垃圾收集（适用于所有浏览器 > IE6）。

Answer 2

我做了以下测试：

<div class="wrapper">
    <a href="#">Link</a>
</div>
<script type="text/javascript">
    window.onload = function() {
        var wrapper = document.querySelector(".wrapper");
        var link = document.querySelector("a");
        link.addEventListener("click", function() {
            console.log("click");
        });
        setTimeout(function() {
            wrapper.innerHTML = "";
        }, 4000)
    }
</script>

并在开发工具中监控结果。加载页面后，附加的事件从 5 变为 6。链接从 DOM 中删除，事件侦听器再次变为 5。