首页 > 代码库 > 使用js加载器动态加载外部Javascript文件

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

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

JsLoader.js

 1 var MiniSite=new Object(); 2 /** 3  * 判断浏览器 4  */ 5 MiniSite.Browser={    6     ie:/msie/.test(window.navigator.userAgent.toLowerCase()),    7     moz:/gecko/.test(window.navigator.userAgent.toLowerCase()),    8     opera:/opera/.test(window.navigator.userAgent.toLowerCase()),    9     safari:/safari/.test(window.navigator.userAgent.toLowerCase())   10 };11 /**12  * JsLoader对象用来加载外部的js文件13  */14 MiniSite.JsLoader={15     /**16      * 加载外部的js文件17      * @param sUrl 要加载的js的url地址18      * @fCallback js加载完成之后的处理函数19      */20     load:function(sUrl,fCallback){   21         var _script=document.createElement(‘script‘);   22         _script.setAttribute(‘charset‘,‘gbk‘);   23         _script.setAttribute(‘type‘,‘text/javascript‘);   24         _script.setAttribute(‘src‘,sUrl);   25         document.getElementsByTagName(‘head‘)[0].appendChild(_script);   26         if(MiniSite.Browser.ie){   27             _script.onreadystatechange=function(){   28                 if(this.readyState==‘loaded‘||this.readyStaate==‘complete‘){ 29                     //fCallback();30                     if(fCallback!=undefined){31                          fCallback(); 32                     }33                      34                 }   35             };   36         }else if(MiniSite.Browser.moz){   37             _script.onload=function(){   38                 //fCallback(); 39                 if(fCallback!=undefined){40                         fCallback(); 41                 }42             };   43         }else{   44             //fCallback();45             if(fCallback!=undefined){46                     fCallback(); 47             }48         }   49     }   50 };

JsLoader.js测试

 1 <!DOCTYPE HTML> 2 <html> 3   <head> 4   <!--引入js加载器  --> 5    <script type="text/javascript" src="js/JsLoader.js"></script> 6     <title>JsLoaderTest.html</title> 7     <script type="text/javascript"> 8         if(MiniSite.Browser.ie){ 9             //动态加载Js10             MiniSite.JsLoader.load("js/jquery-1.9.1.js",function(){11                 alert("动态加载的是jquery-1.9.1.js");12                 $(function(){13                     alert("jquery-1.9.1.js动态加载完成之后做的处理操作");14                 });15             });   16         }else{17             MiniSite.JsLoader.load("js/jquery-2.0.3.js",function(){18                 alert("动态加载的是jquery-2.0.3.js");19                 $(function(){20                     alert("jquery-2.0.3.js动态加载完成之后做的处理操作");21                 });22             });23         }24     </script>25   </head>26   27   <body>28    29   </body>30 </html>

测试结果如下:

IE浏览器下测试结果:

google浏览器下的测试结果: