Question

如何删除附加的脚本，因为它会在我的应用中导致一些问题。

这是我获取脚本的代码

var nowDate = new Date().getTime();
var url = val.redirect_uri + "notify.js?nocache=" + nowDate + "&callback=dummy";
var script = document.createElement('script');
script.src = url;
document.body.appendChild(script);

然后我有一个自动加载功能，导致创建另一个元素脚本。

我想摆脱添加另一个元素之前附加的前一个元素。

Answer 1

基本上，您可以使用与此类似的功能删除脚本标记：

function removeJS(filename){
 var tags = document.getElementsByTagName('script');
 for (var i = tags.length; i >= 0; i--){ //search backwards within nodelist for matching elements to remove
  if (tags[i] && tags[i].getAttribute('src') != null && tags[i].getAttribute('src').indexOf(filename) != -1)
   tags[i].parentNode.removeChild(tags[i]); //remove element by calling parentNode.removeChild()
 }
}

注意，它使用filename参数来标识要删除的目标脚本。另请注意，目标脚本可能已在您尝试删除时执行。

Answer 2

我只是检查你是否已经添加了脚本。添加然后删除会增加不必要的复杂性。这样的事情应该有效：

var scriptAdded = false;

if(scriptAdded == false) {
    document.body.appendChild(script);
    scriptAdded = true;
}

Answer 3

我做了一些测试，在你得到正确答案之前（希望有一个），你可以尝试一下：

<button onclick="foo()">ShowHTML</button>
<script>
(function foo(){
    var b=function moo(){
        var c=document.getElementsByTagName('script');
        alert(document.body.innerHTML);
        c[0].parentElement.removeChild(c[0]);
        alert(document.body.innerHTML);
    }
    var a=setTimeout(b,1000);
    b=null;
})();
foo=null;
</script>

这只是一个测试代码，但它包含一个想法，如何解决问题。它从DOM中删除<sript>，最后一行破坏了脚本的所有功能。

（该代码还有一些细节，显示setTimeout将eval()执行{{1}}，无论它如何论证......？）

Answer 4

您可以做的是在加载脚本后立即删除脚本：

var nowDate = new Date().getTime();
var url = val.redirect_uri + "notify.js?nocache=" + nowDate + "&callback=dummy";
var script = document.createElement('script');
script.src = url;
script.onload = function( evt ) {
    document.body.removeChild ( this );
}
document.body.appendChild(script);

无论如何，我认为最好将脚本附加到标题（所有其他脚本所在的位置）而不是正文。

Answer 5

对于JSONP和你使用jQuery，为什么不充分利用jQuery的JSONP加载工具，为你做后期清理？像这样加载JSONP资源，不会在DOM中留下痕迹：

$.ajax({ url: 'http://example.com/', dataType: 'jsonp' })

用于加载的<script>标记会在加载后立即删除。如果加载成功。另一方面，失败的请求不会自动清除，你必须自己做这样的事情：

$('head script[src*="callback="]').remove();

在合适的时间召集。它会删除所有待处理的JSONP <script>标记。

Answer 6

那么，
由于事件触发了ajax调用，我得到了同样的需求。最早的一些电话可能会在稍后返回，然后覆盖文档由最后一次电话填充。

removeChild(scriptEl) 不起作用。更改src属性也不起作用。

如果jsonp是你唯一的出路，如果您控制了服务器响应，你可以让那些追加来区分回调的回报。

只需传递timestamp参数，然后在回调中检查

//callback
function dummy(res, ts) {
 if(YAHOO.util.Selector.query('script[id='scriptIdPrefix+ts+']').length>0) {
     do your job
 } else {
     do nothing
 }
}

//add script
var scriptIdPrefix='myScriptId';
function ajaxCall() {
    var timestamp = new Date().getTime();
    var scriptId = scriptIdPrefix+timestamp;
    //remove the previous script el
    s=YAHOO.util.Selector.query('script[id^='+scriptIdPrefix+']');
    if(s.length>0) {
        document.body.removeChild(s[0]);
    }
    var script = document.createElement('SCRIPT');
    script.id = scriptId;
    script.type = 'text/javascript';
    script.src = 'http://server/notify.js&callback=dummy&ts='+timestamp;
    document.body.appendChild(script);

}

相应地汇总服务器notify.js的结果：

dummy([{"datax":"x","datay":"y"}], 1369838562792)

通过这种方式，您将只有一个这样的脚本元素参数id

<script id="myScriptId1369838562792" type="text/javascript"  
src="http://server/notify.js?callback=dummy&ts=1369838562792"></script>

Answer 7

最简单的方法。

document.scripts.s16483498357511596685.remove（）;

Answer 8

只需在创建脚本元素时为其添加一个 id。

这样您就不必遍历与您的源匹配的所有“脚本”标签。相反，只是做

const script = document.createElement("script");

script.src = "SOME_SCRIPT";
script.id = 'SOME_ID';

document.body.append(script);

然后删除

const scriptElem = document.getElementById('SOME_ID'); 
scriptElem.remove()

一些家伙在这里解释了为什么可以将 id 添加到脚本标签 https://stackoverflow.com/a/2741488/13156886

Answer 9

var flag1=0,flag2=0;
$(window).resize(function(){
    if ($(window).width() < 480){
        flag1++;
        console.log(flag1);
        flag2=0;  
    }
    else 
        if($(window).width() > 480){
            flag2++;
            console.log(flag2);
            flag1=0;
        }   
    if(flag1==1){
        $("body").append("<script class='abc' src='custom.js'/>");
    }
    else
        if(flag2==1){
            $(".abc").remove();
        }
});

删除附加的脚本javascript

9 个答案: