动态导入js引发的问题

比较常见的用于动态导入js的方法有以下两种：

Js代码  

1. //方法一     
2. document.write("<script language=\"JavaScript\" type=\"text/javascript\" src=\"t.js\"><\/script>");     
3.     
4. //方法二     
5. var script = document.createElement("script");     
6. script.src = "t.js";     
7. script.type = "text/javascript";     
8. document.getElementsByTagName("head").item(0).appendChild(script);     

今天做动态导入时发现了问题，t.js内容如下：

Js代码  

1. function M(){alert("m");}    

 调用代码： 

Js代码  

1. document.write("<script language=\"JavaScript\" type=\"text/javascript\" src=\"t.js\"><\/script>");     
2. M();    

 脚本出错，提示缺少对象(使用方法二也有同样的问题)。为了说明问题，我们稍做修改，t.js内容如下： 

Java代码  

1. function M(){alert("m");}     
2. alert("t.js");    

调用代码：

Js代码  

1. document.write("<script language=\"JavaScript\" type=\"text/javascript\" src=\"t.js\"><\/script>");     
2. alert("index.htm");     

可以看到，是先弹出"index.htm"，再弹出"t.js"，这说明t.js的导入是在页面脚本执行完后进行的，在执行M()时，M函数还未声明，因而报错。解决方法：

Php代码  

1. <script>     
2. function bar(u) {     
3.     var x=window.ActiveXObject?new ActiveXObject("MSXML2.XMLHTTP"):new XMLHttpRequest();     
4.     x.open("GET",u,false);     
5.     x.send(null);     
6.     s=x.responseText;     
7.     try {window.execScript(s)}catch(ex){window.eval(s)};//Mozilla下window.eval大致与IE的window.execScript方法功能相同     
8. }     
9. bar("t.js");     
10. M();     
11. </script>     

采用上边方法的不足是：当index.htm和t.js不在同一台服务器上时，index.htm脚本执行会出错，提示没有权限。下边代码摘自QQ首页，测试通过：

Js代码  

1. <script type="text/javascript">     
2. var MiniSite=new Object();     
3. MiniSite.Browser={     
4.     ie:/msie/.test(window.navigator.userAgent.toLowerCase()),     
5.     moz:/gecko/.test(window.navigator.userAgent.toLowerCase()),     
6.     opera:/opera/.test(window.navigator.userAgent.toLowerCase()),     
7.     safari:/safari/.test(window.navigator.userAgent.toLowerCase())     
8. };     
9. MiniSite.JsLoader={     
10.     load:function(sUrl,fCallback){     
11.         var _script=document.createElement('script');     
12.         _script.setAttribute('charset','gb2312');     
13.         _script.setAttribute('type','text/javascript');     
14.         _script.setAttribute('src',sUrl);     
15.         document.getElementsByTagName('head')[0].appendChild(_script);     
16.         if(MiniSite.Browser.ie){     
17.             _script.onreadystatechange=function(){     
18.                 if(this.readyState=='loaded'||this.readyStaate=='complete'){     
19.                     fCallback();     
20.                 }     
21.             };     
22.         }else if(MiniSite.Browser.moz){     
23.             _script.onload=function(){     
24.                 fCallback();     
25.             };     
26.         }else{     
27.             fCallback();     
28.         }     
29.     }     
30. };     
31.     
32. MiniSite.JsLoader.load("http://www.mzwu.com/t.js",function(){M();});     
33. </script>     
34.     

 原文地址： http://www.ai-java.com/entry/117
来自 http://rainbow702.iteye.com/blog/1165029