往往有些时候,我们需要动态地加载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);
};
};
在IE环境下SCRIPT元素的onreadystatechange事件可以作回调检查是否已经加载完毕,在非IE环境下对元素的onload事件来判断是否已加载。
本文介绍了两种动态加载JavaScript文件的方法:动态创建SCRIPT元素与使用XMLHTTP请求后进行eval。重点讲解了通过动态创建SCRIPT元素的方式,并给出了兼容不同浏览器的具体实现代码。
346

被折叠的 条评论
为什么被折叠?



