欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

同步異步動(dòng)態(tài)引入js文件的幾種方法總結(jié)

 更新時(shí)間:2016年09月23日 07:54:21   投稿:jingxian  
下面小編就為大家?guī)?lái)一篇同步異步動(dòng)態(tài)引入js文件的幾種方法總結(jié)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧

動(dòng)態(tài)加載js文件

有時(shí)候我們需要根據(jù)參數(shù)不同來(lái)引入不同的js文件,用html直接寫標(biāo)簽滿足不了我們的需求,總結(jié)幾種方法,以及同步異步加載的各種需求

一.直接加載

<div id="divId"></div>
<script>

二.異步加載,并發(fā)執(zhí)行,但引入js內(nèi)容不能直接使用

//1.1 直接document.write
 document.write("<script src='test.js'><\/script>"); 
//1.2 動(dòng)態(tài)改變已有script的src屬性
 //頁(yè)面中有<script src='' id="s1"></ script> 
document.getElementById('s1').src="test.js";
 //1.3 動(dòng)態(tài)創(chuàng)建js
 var rootObject=document.getElementById("divId");
 var oScript = document.createElement( "script" );
 oScript.type = "text/javascript"; 
 oScript.src = test.js; //test.js方法中有一個(gè)方法function test(){alert("test");}
 rootObject.appendChild(oScript); 
 //2.0 調(diào)用js
 test();//在ie中不會(huì)出錯(cuò),在firefox會(huì)出錯(cuò),因?yàn)閒irefox默認(rèn)為異步加載(在向服務(wù)器請(qǐng)求加載test.js文件的同時(shí),繼續(xù)向下執(zhí)行了,調(diào)用test()方法,就自然找不到這個(gè)方法)

三.同步加載,單步加載,引入js內(nèi)容可以直接使用

var Skip={};
//獲取XMLHttpRequest對(duì)象(提供客戶端同http服務(wù)器通訊的協(xié)議)
Skip.getXmlHttpRequest=function (){ 
 if ( window.XMLHttpRequest ) // 除了IE外的其它瀏覽器
 return new XMLHttpRequest() ; 
 else if ( window.ActiveXObject ) // IE 
return new ActiveXObject("MsXml2.XmlHttp") ; 
},
//導(dǎo)入內(nèi)容
Skip.includeJsText =function (rootObject,jsText){ 
 if ( rootObject != null ){ 
 var oScript = document.createElement( "script" );
 oScript.type = "text/javascript"; 
//oScript.id = sId; 
//oScript.src = fileUrl; 
//oScript.defer = true; 
oScript.text = jsText; 
rootObject.appendChild(oScript); 
//alert(oScript.text);
 } 
 },
//導(dǎo)入文件
Skip.includeJsSrc =function (rootObject, fileUrl){ 
 if ( rootObject != null ){ 
 var oScript = document.createElement( "script" ); 
 oScript.type = "text/javascript"; 
 oScript.src = fileUrl; 
 rootObject.appendChild(oScript); 
 } 
},
//同步加載
Skip.addJs=function(rootObject, url){ 
 var oXmlHttp = Skip.getXmlHttpRequest() ; 
 oXmlHttp.onreadystatechange = function(){//其實(shí)當(dāng)在第二次調(diào)用導(dǎo)入js時(shí),因?yàn)樵跒g覽器當(dāng)中存在這個(gè)*.js文件了,它就不在訪問(wèn)服務(wù)器,也就不在執(zhí)行這個(gè)方法了,這個(gè)方法也只有設(shè)置成異步時(shí)才用到
if ( oXmlHttp.readyState == 4 ){ //當(dāng)執(zhí)行完成以后(返回了響應(yīng))所要執(zhí)行的
 if ( oXmlHttp.status == 200 || oXmlHttp.status == 304 ){ //200有讀取對(duì)應(yīng)的url文件,404表示不存在這個(gè)文件
 Skip.includeJsSrc( rootObject, url); 
 } else{ 
 alert( 'XML request error: ' + oXmlHttp.statusText + ' (' + oXmlHttp.status + ')' ) ; 
 } 
} 
} 
//1.True 表示腳本會(huì)在 send() 方法之后繼續(xù)執(zhí)行,而不等待來(lái)自服務(wù)器的響應(yīng),并且在open()方法當(dāng)中有調(diào)用到onreadystatechange()這個(gè)方法。通過(guò)把該參數(shù)設(shè)置為 "false",可以省去額外的 onreadystatechange 代碼,它表示服務(wù)器返回響應(yīng)后才執(zhí)行send()后面的方法.
//2.同步執(zhí)行oXmlHttp.send()方法后oXmlHttp.responseText有返回對(duì)應(yīng)的內(nèi)容,而異步還是為空,只有在oXmlHttp.readyState == 4時(shí)才有內(nèi)容,反正同步的在oXmlHttp.send()后的操作就相當(dāng)于oXmlHttp.readyState == 4下的操作,它相當(dāng)于只有了這一種狀態(tài).
oXmlHttp.open('GET', url, false); //url為js文件時(shí),ie會(huì)自動(dòng)生成 '<script src="*.js" type="text/javascript"> </scr ipt>',ff不會(huì) 
oXmlHttp.send(null); 
Skip.includeJsText(rootObject,oXmlHttp.responseText);
}
};
var rootObject=document.getElementById("divId");
Skip.addJs(rootObject,"test.js")//test.js文件中含有funciotn test(){alert("test");}
test();//即使馬上調(diào)用也不會(huì)出錯(cuò)了.
</script>

總結(jié):

1. ie動(dòng)態(tài)加載js文件時(shí),它默認(rèn)就為同步,可以不用設(shè)置同步(也可直調(diào)用Skip.includeJsSrc())

2. ff動(dòng)態(tài)加載js文件時(shí),它默認(rèn)為異步,要設(shè)置成同步,加載完直接調(diào)用才不會(huì)出錯(cuò)

3. 無(wú)論ie還是ff在動(dòng)態(tài)加載js內(nèi)容時(shí),沒(méi)有請(qǐng)求服務(wù)器,不會(huì)存在異步問(wèn)題

注:無(wú)論ie還是ff在頁(yè)面加載js時(shí)(即執(zhí)行整個(gè)頁(yè)面),都是為同步的加載,除非設(shè)置script的屬性defer="true"(此屬性好像也只是對(duì)ie有效)

以上就是小編為大家?guī)?lái)的同步異步動(dòng)態(tài)引入js文件的幾種方法總結(jié)的全部?jī)?nèi)容了,希望對(duì)大家有所幫助,多多支持腳本之家~

相關(guān)文章

最新評(píng)論