145
js動態加載腳本
/**
* 同步加載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;
}
}
調用方法：loadJS("myJS","package.js")
<html>
<head>
<title></title>
<script type="text/javascript">
function init()
{
//加載package.js文件，設置script的id為yy
loadJs("yy","package.js",callbackFunction);
}
function callbackFunction()
{
functionOne();
}
function loadJs(sid,jsurl,callback){
var nodeHead = document.getElementsByTagName('head')[0];
var nodeScript = null;
if(document.getElementById(sid) == null){
nodeScript = document.createElement('script');
nodeScript.setAttribute('type', 'text/javascript');
nodeScript.setAttribute('src', jsurl);
nodeScript.setAttribute('id',sid);
if (callback != null) {
nodeScript.onload = nodeScript.onreadystatechange = function(){
if (nodeScript.ready) {
return false;
}
if (!nodeScript.readyState || nodeScript.readyState == "loaded" || nodeScript.readyState == 'complete') {
nodeScript.ready = true;
callback();
}
};
}
nodeHead.appendChild(nodeScript);
} else {
if(callback != null){
callback();
}
}
}
</script>
</head>
<body>
<input type="button" value="測試按鈕" />
</body>
</html>
回調函數方式
來源：https://www.cnblogs.com/zhuimengdeyuanyuan/archive/2013/03/06/2946277.html
最後更新：2017-04-03 22:15:29