Question

如何在执行之前删除脚本元素？

我考虑过使用DOMNodeInserted事件，但显然它没有捕获脚本元素。我也尝试过使用jQuery livequery插件：

$("script").livequery(function () { $(this).remove(); });

它确实删除了脚本元素，但是在执行之后。

我正在寻找一个跨浏览器的解决方案，但我甚至不确定这是否可行。我读到Mutation Observers似乎足够接近，但我不确定它是否可以解决我的问题。

如果有一种方法可以在执行脚本内容之前修改脚本内容而不删除并重新创建它，那就更好了。

Answer 1

删除脚本元素不会执行任何操作。如果你能以某种方式访问一个脚本元素，它很久以前就被执行了，删除它就没有效果了。

所以我们需要解决它。如果您的脚本元素位于页面顶部，如下所示：

<head>
    <script src="yourscript.js"></script>

您可以对同一页面发出同步ajax请求，因此您可以将其内容解析为新文档，修改所有脚本标记然后替换包含修改后文档的当前文档。

var xhr = new XMLHttpRequest,
    content,
    doc,
    scripts;

xhr.open( "GET", document.URL, false );
xhr.send(null);
content = xhr.responseText;

doc = document.implementation.createHTMLDocument(""+(document.title || ""));

doc.open();
doc.write(content);
doc.close();


scripts = doc.getElementsByTagName("script");
//Modify scripts as you please
[].forEach.call( scripts, function( script ) {
    script.removeAttribute("src");
    script.innerHTML = 'alert("hello world");';
});

//Doing this will activate all the modified scripts and the "old page" will be gone as the document is replaced
document.replaceChild( document.importNode(doc.documentElement, true), document.documentElement);

不幸的是，这不能在jsfiddle或jsbin中设置。但是你应该可以复制粘贴这段代码 google chrome中的页面控制台。您应该看到警报，当您检查实时dom时，每个脚本都被修改。

不同之处在于我们在页面上执行脚本后运行此脚本，因此旧脚本仍应对页面起作用。这就是为什么要使这个工作，你需要成为页面上的第一个脚本来实现它。

经测试可在Google Chrome中使用。由于某种原因，Firefox完全忽略doc.write调用。

Answer 2

我不知道你要做什么。但最好是根据请求加载它们而不是在某些条件下删除它们。

$.getScript('helloworld.js', function() {
     $("#content").html('
          Javascript is loaded successful! 
     ');
  });

如果要在执行之前删除脚本，则无法执行。但你可以做的是，在条件和编程上以编程方式删除脚本。如果有内存泄漏问题，那么你可以在删除脚本之前调用下面的代码。

var var1 = 'hello';
var cleanAll = function () {
    delete window.var1;
    delete window.cleanAll;
};

// unload all resources
cleanAll();

如何在执行脚本元素之前将其删除？

2 个答案: