内存中的 JQuery replaceWith() 函数和事件处理程序

Question

假设你有这个 html 代码：

<button id="click-me" type="button">Click Me!</button>

然后你运行这个 jQuery sn-p:

var button = $('#click-me');

button.on('click', function() {
    console.log('Clicked !');
});

button.replaceWith('<button id="click-me" type="button">Click Me (Replaced)!</button>');

当然该按钮不会做任何事情，因为它被另一个没有绑定点击事件处理程序的按钮替换，对吧？。

我的问题是： click 事件处理程序是否仍然存在于内存中的某处？或者，它是否被垃圾收集过程删除了？

Answer 1

点击事件处理程序是否仍然存在于内存中的某处？或者，它是否被垃圾收集过程删除了？

不，该事件再也没有被绑定，因为函数 replaceWith 删除了前一个元素 button 的完整 DOM。

您可以使用事件委托将该事件“绑定”到元素#click-me：

var button = $('#click-me');

$(document).on('click', '#click-me', function() {
    console.log('Clicked !');
});

button.replaceWith('<button id="click-me" type="button">Click Me (Replaced)!</button>');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="click-me" type="button">Click Me!</button>