實現js檔案動態載入的幾種方式簡單介紹

本章節簡單介紹一下動態載入js檔案的幾種方式，需要的朋友可以做一下參考。

一.document.write()方式:

[HTML] 純文字檢視 複製程式碼
<script language="javascript">   
 document.write("<script src='antzone.js'><\/script>");
</script>

二.動態改變已有script的src屬性:

[HTML] 純文字檢視 複製程式碼
<script src='' id="antzone"></script>   
<script>   
antzone.src="softwhy.js"   
</script>
</head>

三.動態建立script元素:

[JavaScript] 純文字檢視 複製程式碼
var body=document.getElementsByTagName('BODY')[0];   
var script=document.createElement("script");   
script.type="text/javascript";   
script.src="antzone.js";   
body.appendChild(oScript);

四.XMLHttpRequest/ActiveXObject載入:

[JavaScript] 純文字檢視 複製程式碼
/** 
* 非同步載入js指令碼 
* @param id   需要設定的<script>標籤的id 
* @param url   js檔案的相對路徑或絕對路徑 
*/  
loadJs:function(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);  
  xmlHttp.onreadystatechange = function(){  
    //4代表資料傳送完畢  
    if( xmlHttp.readyState == 4 ){  
      //0為訪問的本地，200到300代表訪問伺服器成功，
      //304代表沒做修改訪問的是快取  
      if((xmlHttp.status>=200&&xmlHttp.status<300)||xmlHttp.status==0||xmlHttp.status==304){  
        var myBody = document.getElementsByTagName("BODY")[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;  
        }  
        myBody.appendChild(myScript);  
      }  
    }  
  }  
  //採用非同步載入  
  xmlHttp.open("GET",url,true);  
  xmlHttp.send(null);  
}