动态加载js

Posted 2020-08-30 森林丶小斌

要实现动态加载JS脚本有4种方法： 

1、直接document.write
2、动态改变已有script的src属性 
3、动态创建script元素 
　　这三种方法都是异步执行的，也就是说，在加载这些脚本的同时，主页面的脚本继续运行，如果用以上的方法，得不到预期的效果。 
但是 主页面产生了错误，没有弹出对话框。原因是 ‘str‘ 未定义，为什么呢？因为主页面在取 str 的时候 a.js 并没有完全加载成功。遇到需要同步执行脚本的时候，可以用下面的第四种方法。 

4、原理：用XMLHTTP取得要脚本的内容，再创建 Script 对象。 
注意：a.js必须用UTF8编码保存，要不会出错。因为服务器与XML使用UTF8编码传送数据。 

htt丶p://www.iteye.com/topic/147810 参考

function getGobalHead(url,Strstart,Strstop,obj){

    var xhr=null;

    if(window.XMLHttpRequest) xhr=new XMLHttpRequest();

    else xhr=new ActiveXObject("Microsoft.XMLHTTP");

    xhr.open("post",url,true);

    xhr.send();

    xhr.onreadystatechange=function(){

        if(xhr.status==200&&xhr.readyState==4){

            var res=xhr.responseText;

            var m=res.indexOf(Strstart);

            var n=res.indexOf(Strstop);

            obj.innerhtml=res.substring(m,n);

            if(obj.id=="Header") {

                chageUserState();

                addBlur($("loginAndEnroll"));

                submitForm($("loginForm"));

                submitForm($("encrollForm"));

                submitForm($("findStep"));

            }

            if(obj.id=="rightBar"){

                var sourceJs=$TagName(obj,"script")[0];//以下代码实现js的重加载

                //var reloadJs=sourceJs.cloneNode(true);  //克隆节点不能实现重加载，必须创建

                var reloadJs=document_createElement_x("script");

                reloadJs.language = "javascript";       //这3条属性不是必要的，加上以防万一

                reloadJs.type = "text/javascript";

                reloadJs.defer = true;

                reloadJs.text= sourceJs.innerHTML;

                obj.a(reloadJs);

                obj.removeChild($TagName(obj,"script")[0]);

                //添加返回顶部事件

                returnTop=$("rightBar").getElementsByTagName_r("a")[6];

                returnTop.onclick=function(){

                    backTop()

                };

            }

        }

    }

}