javascript - 删除动态 javascript 标签不会删除附加事件

Question

我正在创建一个应用程序，用户可以在其中创建 html 布局并将 JavaScript 附加到其中。

现在我正在尝试做到这一点，以便当他们单击按钮时，他们会进入预览模式，在那里他们可以看到它的运行情况..所以当他们单击时，我在头部添加 javascript 标签(带有他们的 javascript) iframe 的..这一切都很好!

但问题是当他们离开预览模式时，我删除了 javascript 标签，但是当我有这样的代码时:

$('#button').click(function()
{
    alert("ok"); 
});

当我单击 html 按钮时(不在预览模式下!)，它仍然会发出警报，这不应该发生!

似乎在删除 javascript 标签时，监听器没有被删除。或者我做错了？

现在我的问题:有没有办法在我删除脚本标签时删除这些添加的事件监听器？

是的:我知道你可以使用 .off() 删除事件处理程序，但由于我已经附加了事件处理程序，这些也将被删除，我不想要这个!

所以我可以想到两个选择:- 重建整个 iframe- 存储用户添加的事件处理程序，并在离开预览模式时删除它们。

提前致谢

Answer 1

每次“评估”JavaScript 时，它都会成为浏览器“图像”的一部分，并且源代码是否存在于页面上不再重要。您需要手动解绑事件，或者替换事件绑定(bind)的html段。

要从 html 元素中删除事件，您可以使用:

element.parentNode.innerHTML = element.parentNode.innerHTML

这会使用相同的 HTML 重建 DOM 树。