往往有些时候,我们需要动态地加载SCRIPT文件,而不直接在网页中进行引用,这样使网页下载速度更快些。
动态加载脚本文件一般来说有两种方法,一种是动态创建SCRIPT元素,一种是使用XMLHTTP访问后进行eval,这里我重点介绍前者,前者的兼容
//
// Copyright(C) 2006 Forbes Pu. All right reserved.
//
var BROWSER_IE = window.navigator.userAgent.indexOf( " MSIE " ) != - 1 ;
var SCRIPT_TIMEOUT = 20000 ;
function $import(jsurl, fCallback, fError) ... {
if (typeof(fCallback) != "function") fCallback = new Function();
if (typeof(fError) != "function") fError = new Function();
var oScriptEl, oTimeoutHDL, oHead;
oScriptEl = document.createElement("script");
oScriptEl.type = "text/javascript";
oScriptEl.language = "javascript";
oScriptEl.src = jsurl;
oScriptEl.onreadystatechange = doCallback;
if (BROWSER_IE) ...{
oScriptEl.onload = function() ...{
this.readyState = "complete";
doCallback();
};
};
oTimeoutHDL = window.setTimeout(doError, SCRIPT_TIMEOUT);
document.getElementsByTagName("head")[0].appendChild(oScriptEl);
function doCallback() ...{
if (oScriptEl.readyState == "complete" || oScriptEl.readyState == "loaded") ...{
oScriptEl.onload = oScriptEl.onreadystatechange = new Function();
fCallback();
window.clearTimeout(oTimeoutHDL);
oScriptEl.parentNode.removeChild(oScriptEl);
}
};
function doError() ...{
oScriptEl.parentNode.removeChild(oScriptEl);
};
} ;
// Copyright(C) 2006 Forbes Pu. All right reserved.
//
var BROWSER_IE = window.navigator.userAgent.indexOf( " MSIE " ) != - 1 ;
var SCRIPT_TIMEOUT = 20000 ;
function $import(jsurl, fCallback, fError) ... {
if (typeof(fCallback) != "function") fCallback = new Function();
if (typeof(fError) != "function") fError = new Function();
var oScriptEl, oTimeoutHDL, oHead;
oScriptEl = document.createElement("script");
oScriptEl.type = "text/javascript";
oScriptEl.language = "javascript";
oScriptEl.src = jsurl;
oScriptEl.onreadystatechange = doCallback;
if (BROWSER_IE) ...{
oScriptEl.onload = function() ...{
this.readyState = "complete";
doCallback();
};
};
oTimeoutHDL = window.setTimeout(doError, SCRIPT_TIMEOUT);
document.getElementsByTagName("head")[0].appendChild(oScriptEl);
function doCallback() ...{
if (oScriptEl.readyState == "complete" || oScriptEl.readyState == "loaded") ...{
oScriptEl.onload = oScriptEl.onreadystatechange = new Function();
fCallback();
window.clearTimeout(oTimeoutHDL);
oScriptEl.parentNode.removeChild(oScriptEl);
}
};
function doError() ...{
oScriptEl.parentNode.removeChild(oScriptEl);
};
} ;
在IE环境下SCRIPT元素的onreadystatechange事件可以作回调检查是否已经加载完毕,在非IE环境下对元素的onload事件来判断是否已加载。