function loadScript(url, callback){
var script = document.createElement("script")
script.type = "text/javascript";
if (script.readyState){ //IE
script.onreadystatechange = function(){
if (script.readyState == "loaded" || script.readyState == "complete"){
script.onreadystatechange = null;
callback();
}
};
} else { //Others
script.onload = function(){
callback();
};
}
script.src = url;
document.getElementsByTagName("head")[0].appendChild(script);
}
The loadScript() function is used as follows:
loadScript("https://www.jb51.net/file1.js", function(){
alert("File is loaded!");
});
现在你可以按这种动态方式加载脚本了,但是你仍然需要考虑这些文件的下载顺序。主流浏览器中只有FF和Opera保证脚本的执行顺序和你指定的下载顺序一致,其他浏览器将按照脚本文件从服务器返回的顺序来执行。虽然如此,我们仍然有替代的解决方案:
复制代码 代码如下:
loadScript("https://www.jb51.net/file1.js", function(){
loadScript("https://www.jb51.net/file2.js", function(){
loadScript("https://www.jb51.net/file3.js", function(){
alert("All files are loaded!");
});
});
});
这样我们就能保证脚本文件的下载顺序严格的按照file1-file2-file3的方式进行。
注明:以上内容来自:<High Performance JavaScript>by Nicholas C. Zakas
您可能感兴趣的文章: