js动态引入的四种方法

2023-09-13 07:13:06 339

//第一种方式：直接document.write但这样会把当前的页面全覆写掉 //document.write("<\/script>"); //第二种方式:动态改变已有script的src属性 //s1.src="test.js" //第三种方式：动态创建script元素 /*varoHead=document.getElementsByTagName('HEAD').item(0); varoScript=document.createElement("script"); oScript.type="text/javascript"; oScript.src="test.js"; oHead.appendChild(oScript); */ //其实原理就是利用dom动态的引入一个js到文件中来~就能和原有的js通信了~ //alert(str); /*以上三种方式都采用异步加载机制，也就是加载过程中，页面会往下走，如果这样的话会有问题的,如上面的str就访问不到，因为当程序执行alert(str)时，test.js还在加载Ing.... 那么第四种就是基于ajax请求的,且是推荐 */ functionGetHttpRequest() { if(window.XMLHttpRequest)//Gecko returnnewXMLHttpRequest(); elseif(window.ActiveXObject)//IE returnnewActiveXObject("MsXml2.XmlHttp"); } functionajaxPage(sId,url){ varoXmlHttp=GetHttpRequest(); oXmlHttp.onreadystatechange=function() { if(oXmlHttp.readyState==4) { includeJS(sId,url,oXmlHttp.responseText); } } oXmlHttp.open('GET',url,false);//同步操作 oXmlHttp.send(null); } functionincludeJS(sId,fileUrl,source) { if((source!=null)&&(!document.getElementById(sId))){ varoHead=document.getElementsByTagName('HEAD').item(0); varoScript=document.createElement("script"); oScript.type="text/javascript"; oScript.id=sId; oScript.text=source; oHead.appendChild(oScript); } } ajaxPage("scrA","test.js"); alert("主页面动态加载JS脚本。"); alert("主页面动态加载a.js并取其中的变量："+str);

js动态引入的四种方法

热门推荐

随机推荐