javascript中动态加载js文件多种解决办法

1.  var head = document.head  
2.               || document.getElementsByTagName("head")[0]|| document.documentElement;  
3.    var script = document.createElement("script");  
4.    script.setAttribute("type","text/javascript");  
5.    script.setAttribute("src",url);  
6.    //好像只有IE支持  
7.    script.onreadystatechange=function(){  
8.    if(document.readyState=='complete'){  
9.           callback();  
10.        }  
11.      };  
12.    / //  
13.    head.insertBefore(script, head.firstChild);  

        这种方式就是创建一个script对象，在设置script的src属性，这种方式最简单。但是上边利用加载状态来处理，他的兼容不是很好。

　　其实这里把open里面设置为false就是同步加载了，同步加载不需要设置onreadystatechange事件。

方法六：XMLHttpRequest/ActiveXObject同步加载　　

　　在这里我把一些情况考虑在内，写成了一个方法，封装为loadJS.js，方便以后直接调用，代码如下：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58

/**   * 同步加载js脚本   * @param id   需要设置的< script >标签的id   * @param url   js文件的相对路径或绝对路径   * @return {Boolean}   返回是否加载成功，true代表成功，false代表失败   */ function loadJS(id,url){      var  xmlHttp = null;      if(window.ActiveXObject)//IE      {          try {              //IE6以及以后版本中可以使用              xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");          }          catch (e) {              //IE5.5以及以后版本可以使用              xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");          }      }      else if(window.XMLHttpRequest)//Firefox，Opera 8.0+，Safari，Chrome      {          xmlHttp = new XMLHttpRequest();      }      //采用同步加载      xmlHttp.open("GET",url,false);      //发送同步请求，如果浏览器为Chrome或Opera，必须发布后才能运行，不然会报错      xmlHttp.send(null);      //4代表数据发送完毕      if ( xmlHttp.readyState == 4 )      {          //0为访问的本地，200到300代表访问服务器成功，304代表没做修改访问的是缓存          if((xmlHttp.status >= 200 && xmlHttp.status <300) || xmlHttp.status == 0 || xmlHttp.status == 304)          {              var myHead = document.getElementsByTagName("HEAD").item(0);              var myScript = document.createElement( "script" );              myScript.language = "javascript";              myScript.type = "text/javascript";              myScript.id = id;              try{                  //IE8以及以下不支持这种方式，需要通过text属性来设置                  myScript.appendChild(document.createTextNode(xmlHttp.responseText));              }              catch (ex){                  myScript.text = xmlHttp.responseText;              }              myHead.appendChild( myScript );              return true;          }          else          {              return false;          }      }      else      {          return false;      } }

        此处考虑到了浏览器的兼容性以及当为Chrome、Opera时必须是发布，注释还是写的比较清楚的，以后需要加载某个js文件时，只需要一句话就行了，如loadJS("myJS","package.js")。方便实用。

　　如果想要实现不发布还非要兼容所有浏览器，至少我还没找出这样的同步加载的办法，我们只能通过异步加载开出回调函数来实现。

方法七：回调函数方式

　　在同一个文件夹下面创建一个function7.html，代码如下：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26