Javascript 使用JS从html和DOM中删除脚本标记

如何从html和DOM中删除js脚本

举个例子，在我的html中有一个带按钮的div：

<div class="tester">

    <button id="myBtn">Click me!</button>

</div>

当我第一次单击时，它会从html中删除脚本。好啊 当我再次单击时，我预计会出现以下行为： 不要使警报“单击！”（实际上什么也不做）

我现在的行为： 它再次抛出警报“clicked！”（每次单击btn时）

经过一番搜索，我发现： 通过删除标记，您不会从DOM中删除它的任何对象、函数等。因此，在该标记中启动的任何操作都将占上风，即使您删除了最初启动它的元素！

---

那么如何将其从DOM中删除呢？（或其他建议）

您可以在按钮单击事件中检查脚本

var myBtn = document.getElementById("myBtn");

myBtn.addEventListener("click", function(){
    var script = document.getElementById("debug_js");
    if(script){
        alert("clicked!");

        $( script ).remove();
    }
}); 

也可以在单击后删除事件处理程序

var myBtn = document.getElementById("myBtn");
var script = document.getElementById("debug_js");

var btnHandler = function(){
    alert("clicked!");
    $( script ).remove();
    myBtn.removeEventListener("click", btnHandler);
}

myBtn.addEventListener("click", btnHandler);

---

使用

Javascript

从

HTML

中删除所有

script

标记有两种通用方法：

REGEX

const patt = /<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script\s*>/gi
const html = document.getElementsByTagName('html')[0]
html.innerHTML =  html.innerHTML.replace(patt, '')

---

const patt=/从本质上讲，从DOM中删除脚本功能似乎（至少对我来说）很愚蠢，因为您可以简单地从脚本中禁用所需的功能？？这可能有助于了解您试图执行的操作背后的原因。这并不愚蠢，因为我想从ajax请求加载新html并以友好的方式更改html内容，因此当添加新html时，旧html的旧js脚本不再需要@ZakAs，您已经读过了，无法删除脚本本身，即使可以移除该元素。在过去，有一个技巧，将脚本的src更改为不存在的文件，这在现代浏览器中不再起作用（更改已解析脚本元素的src不会加载新脚本）。我想要的是将其内容从DOM中删除，因为我想在其他“更大”的项目中实现这一点。内容消失了，但是你连接了一个事件监听器。如果希望删除单击事件，可以调用removeEventListener来删除该事件。在我的回答中添加了这个选项，如果我想（在删除旧的js脚本之后）：1º从ajax请求中加载另一个html，2º将其附加到html，3º附加一个新的js脚本，该脚本也有一个与该按钮同名的函数？我并没有真正遵循您想要的逻辑。卸载和加载同一按钮的新脚本对我来说似乎很奇怪。必须有另一种方法来获得你想要的最终结果，但我不太确定那是什么。
const patt = /<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script\s*>/gi
const html = document.getElementsByTagName('html')[0]
html.innerHTML =  html.innerHTML.replace(patt, '')