使用js加载器动态加载外部Javascript文件

原文：http://www.cnblogs.com/xdp-gacl/p/3927417.html

 

今天在网上找到了一个可以动态加载js文件的js加载器，具体代码如下：

JsLoader.js

var MiniSite=new Object();
/**
 * 判断浏览器
 */
MiniSite.Browser={   
    ie:/msie/.test(window.navigator.userAgent.toLowerCase()),   
    moz:/gecko/.test(window.navigator.userAgent.toLowerCase()),   
    opera:/opera/.test(window.navigator.userAgent.toLowerCase()),   
    safari:/safari/.test(window.navigator.userAgent.toLowerCase())   
};
/**
 * JsLoader对象用来加载外部的js文件
 */
MiniSite.JsLoader={
    /**
     * 加载外部的js文件
     * @param sUrl 要加载的js的url地址
     * @fCallback js加载完成之后的处理函数
     */
    load:function(sUrl,fCallback){   
        var _script=document.createElement('script');   
        _script.setAttribute('charset','gbk');   
        _script.setAttribute('type','text/javascript');   
        _script.setAttribute('src',sUrl);   
        document.getElementsByTagName('head')[0].appendChild(_script);   
        if(MiniSite.Browser.ie){   
            _script.onreadystatechange=function(){   
                if(this.readyState=='loaded'||this.readyStaate=='complete'){ 
                    //fCallback();
                    if(fCallback!=undefined){
                         fCallback(); 
                    }
                     
                }   
            };   
        }else if(MiniSite.Browser.moz){   
            _script.onload=function(){   
                //fCallback(); 
                if(fCallback!=undefined){
                        fCallback(); 
                }
            };   
        }else{   
            //fCallback();
            if(fCallback!=undefined){
                    fCallback(); 
            }
        }   
    }   
};

JsLoader.js测试

<!DOCTYPE HTML>
<html>
  <head>
  <!--引入js加载器  -->
   <script type="text/javascript" src="js/JsLoader.js"></script>
    <title>JsLoaderTest.html</title>
    <script type="text/javascript">
        if(MiniSite.Browser.ie){
            //动态加载Js
            MiniSite.JsLoader.load("js/jquery-1.9.1.js",function(){
                alert("动态加载的是jquery-1.9.1.js");
                $(function(){
                    alert("jquery-1.9.1.js动态加载完成之后做的处理操作");
                });
            });   
        }else{
            MiniSite.JsLoader.load("js/jquery-2.0.3.js",function(){
                alert("动态加载的是jquery-2.0.3.js");
                $(function(){
                    alert("jquery-2.0.3.js动态加载完成之后做的处理操作");
                });
            });
        }
    </script>
  </head>
  
  <body>
   
  </body>
</html>

测试结果如下：

IE浏览器下测试结果：

google浏览器下的测试结果：

posted @ 2016-12-22 11:23  这个名字想了很久~  阅读(3529)  评论(0)  编辑  收藏  举报