您的位置：首页 > Web前端 > JavaScript

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

2016-02-17 00:00 881 查看

　　今天在网上找到了一个可以动态加载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             //动态加载Js
10  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浏览器下的测试结果：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航