今天在网上找到了一个可以动态加载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浏览器下的测试结果:
原创文章,作者:奋斗,如若转载,请注明出处:https://blog.ytso.com/11418.html