首页 > 解决方案 > 如何在 javascript 代码中禁用 js 文件?

问题描述

我在几个 Js 文件中做了几个类似的事情。我想在条件语句中停用一些 js 文件并在另一个文件中启用其他文件。我怎样才能做到这一点?

例如:

// My files: | javascript_1.js | - |  javascript_2.js |

if( flag == true ){
// disable javascript_1.js
}
else{
// enable javascript_2.js
}

标签: javascripthtmljquerytypescript

解决方案


尝试使用以下内容:

如果单击Add Bootstrap引导程序将被动态添加。如果点击Remove Bootstrap会被动态移除;

您可以通过输入字段和按钮样式进行检查

function removejscssfile(filename, filetype){
    let targetelement=(filetype=="js")? "script" : (filetype=="css")? "link" : "none"; //determine element type to create nodelist from
    let targetattr=(filetype=="js")? "src" : (filetype=="css")? "href" : "none"; //determine corresponding attribute to test for
    let allsuspects=document.getElementsByTagName(targetelement);
    for (var i=allsuspects.length; i>=0; i--){ //search backwards within nodelist for matching elements to remove
    if (allsuspects[i] && allsuspects[i].getAttribute(targetattr)!=null && allsuspects[i].getAttribute(targetattr).indexOf(filename)!=-1)
        allsuspects[i].parentNode.removeChild(allsuspects[i]); //remove element by calling parentNode.removeChild()
    }
}

function createjscssfile(filename, filetype){
    let fileref;
    if (filetype=="js"){ //if filename is a external JavaScript file
        fileref=document.createElement('script')
        fileref.setAttribute("type","text/javascript")
        fileref.setAttribute("src", filename)
    }
    else if (filetype=="css"){ //if filename is an external CSS file
        fileref=document.createElement("link")
        fileref.setAttribute("rel", "stylesheet")
        fileref.setAttribute("type", "text/css")
        fileref.setAttribute("href", filename)
    }
    document.getElementsByTagName("head")[0].appendChild(fileref);
}

function addB() {
    createjscssfile('https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css','css');
    createjscssfile('https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js','js');
    createjscssfile('https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js','js');
}

function removeB() {
    removejscssfile('https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css','css');
    removejscssfile('https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js','js');
    removejscssfile('https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js','js');
}
<button type="button" class="btn btn-success" onclick="addB()">Add Bootstrap</button>
<button type="button" class="btn btn-danger" onclick="removeB()">Remove Bootstrap</button>

<div class="mb-3">
  <label for="exampleFormControlInput1" class="form-label">Email address</label>
  <input type="email" class="form-control" id="exampleFormControlInput1" placeholder="name@example.com">
</div>

希望这可以帮助 :)


推荐阅读