四種常用的javascript動態載入方法實作程式碼總結

有時候我們需要動態的加入適合的js，因為有時候不需要將所有的js都載入進來，以來提高效率，下面是4種比較常用的方法

1、直接document.write 

<script language="javascript"> 
document.write("<script src=&#39;test.js&#39;><\/script>"); 
</script>

2、動態改變已有script的src屬性 

<script src=&#39;&#39; id="s1"></script> 
<script language="javascript"> 
s1.src="test.js" 
</script>

#3、動態創建script元素 

<script> 
var oHead = document.getElementsByTagName(&#39;HEAD&#39;).item(0); 
var oScript= document.createElement("script"); 
oScript.type = "text/javascript"; 
oScript.src="test.js"; 
oHead.appendChild( oScript); 
</script>

這三種方法都是非同步執行的

4、原理：用XMLHTTP取得要腳本的內容，再建立Script 物件。
注意：a.js必須用UTF8編碼儲存，要不會出錯。因為伺服器與XML使用UTF8編碼傳送資料。
主頁程式碼： 

<script language="JavaScript"> 
function GetHttpRequest() 
{ 
if ( window.XMLHttpRequest ) // Gecko 
return new XMLHttpRequest() ; 
else if ( window.ActiveXObject ) // IE 
return new ActiveXObject("MsXml2.XmlHttp") ; 
} 
function AjaxPage(sId, url){ 
var oXmlHttp = GetHttpRequest() ; 
oXmlHttp.OnReadyStateChange = function() 
{ 
if ( oXmlHttp.readyState == 4 ) 
{ 
if ( oXmlHttp.status == 200 || oXmlHttp.status == 304 ) 
{ 
IncludeJS( sId, url, oXmlHttp.responseText ); 
} 
else 
{ 
alert( &#39;XML request error: &#39; + oXmlHttp.statusText + &#39; (&#39; + oXmlHttp.status + &#39;)&#39; ) ; 
} 
} 
} 
oXmlHttp.open(&#39;GET&#39;, url, true); 
oXmlHttp.send(null); 
} 
function IncludeJS(sId, fileUrl, source) 
{ 
if ( ( source != null ) && ( !document.getElementById( sId ) ) ){ 
var oHead = document.getElementsByTagName(&#39;HEAD&#39;).item(0); 
var oScript = document.createElement( "script" ); 
oScript.language = "javascript"; 
oScript.type = "text/javascript"; 
oScript.id = sId; 
oScript.defer = true; 
oScript.text = source; 
oHead.appendChild( oScript ); 
} 
} 
AjaxPage( "scrA", "b.js" ); 
alert( "主页面动态加载JS脚本。"); 
alert( "主页面动态加载a.js并取其中的变量：" + str ); 
</script>

現在完成了一個JS腳本的動態載入。 

var Rash=true; 
var msg=""; 
function norash() 
{ 
if (confirm("确定要取消吗")) 
Rash=false; 
} 
function rashit() 
{ 
setInterval('getrss()',Inttime); 
} 
function getrss() 
{ 
if (Rash==true) 
{ 
head=document.getElementsByTagName('head').item(0); 
script=document.createElement('script'); 
script.src='INCLUDE/AutoUpdate.asp'; 
script.type='text/javascript'; 
script.defer=true; 
void(head.appendChild(script)); 
window.status=msg; 
} 
} 
rashit();

以上是四種常用的javascript動態載入方法實作程式碼總結的詳細內容。更多資訊請關注PHP中文網其他相關文章！