动态创建js脚本和 css样式

Posted 2021-02-12 zhanglw

//1、动态添加外部js文件
function loadScript(url){
    var script = document.createElement("script");
    script.type = "text/javacsript";
    script.src = url;
    document.body.appendChild(script);
}

//2、动态添加js代码
function loadScriptString(code){
    var script = document.createElement("script");
    script.type = "text/javascript";
    try{
        script.appendChild(document.createTextNode(code));
    }catch (e) {
        script.text = code;
    }
    document.body.appendChild(script);
}


//3、动态添加外部css文件
function loadStyles(url){
    var link = document.createElement("link");
    link.type = "text/css";
    link.rel = "stylesheet";
    link.href = url;
    var head = document.getElementsByName("head")[0];

    head.appendChild(link);
}

//4、动态添加css代码
function loadStyleString(css) {
    var style = document.createElement("style");
    style.type = "text/css";
    try{
        style.appendChild(document.createTextNode(css));

    }catch (e) {
        style.styleSheet.cssText = css;
    }
    var head = document.getElementsByTagName("head")[0];
    head.appendChild(style);
}