Script文件异步加载方法

总所周知，使用 script 放置在页面顶端，在DOM渲染的时候由于引擎的解析会延迟页面的加载时间，在 Yahoo！前端性能中也提到了有关内容。使用 script load 能够在页面加载速度上得到一定的提升，使用范围也包含了使用 dom 直接添加元素至 head，使用 Ajax 请求脚本路径，然后使用 eval 函数执行，也可以通过 iframe 加载。

当然，每种方法有每种方法不同的使用环境，效果也完全不一致。具体可以参考《高性能网站建设指南》一书。下面是使用 script dom write 的方法实现，有需要的朋友可以参考参考。

var loadScript = function (fileList, callBack) {
var count = 0, i = 0, len = fileList.length, scriptObj,
d = document,
headObj = d.documentElement.firstChild,
done = function (idx) {
if (++count == len && callBack) {
callBack();
}
};
while (i < len) {
file = fileList[i];
if (!file) {
done(i);
i++;
continue;
}
scriptObj = d.createElement("script");
scriptObj.type = "text/javascript";
scriptObj.async = true;
if (scriptObj.readyState) {
scriptObj.onreadystatechange = function (idx) {
return function () {
var state = this.readyState;
if (state == "loaded" || state == "complete" || state == "completed") {
this.onreadystatechange = null;
done(idx);
}
};
}(i);
} else {
scriptObj.onload = function (idx) {
return function () {
done(idx);
};
}(i);
}
scriptObj.src = file;
/* headObj.insertBefore(scriptObj, headObj.firstChild);*/
/* This ensures execution order is preserved in browsers that support it - Gecko & Webkit*/
headObj.appendChild(scriptObj);
i++;
}
}

from: http://www.qcoke.com/?p=830[/code]