标签：
已知一个需要动态加载的js的文件路径数组，动态加载数组里面所有的js文件。
加载分两种情况：
1. 并行加载，不管js的执行顺序。
2. 串行加载，即一个一个加载，上一个加载完再加载下一个，直到最后。
动态加载js一般都是动态创建一个script，
解决第一种情况：
function loadExternalFile(src,parentElement,tagName){
var elem = document.createElement(tagName);
if(tagName===‘link‘){
elem.setAttribute(‘href‘,src);
elem.setAttribute(‘rel‘,‘stylesheet‘);
}else if(tagName===‘script‘){
elem.setAttribute(‘src‘,src);
elem.setAttribute(‘type‘,‘text/javascript‘);
}
parentElement.appendChild(elem);
}
解决第二种情况：
function loadScript(url, parentEle, tagName, callback){
var ele = document.createElement(tagName);
var typeProp = tagName===‘script‘?‘type‘:‘rel‘;
ele[typeProp] = tagName===‘script‘?‘text/javascript‘:‘stylesheet‘;
if (ele.readyState){ //IE
ele.onreadystatechange = function(){
if (ele.readyState == "loaded" ||
ele.readyState == "complete"){
ele.onreadystatechange = null;
callback();
}
};
} else { //Others
ele.onload = function(){
callback();
};
}
typeProp = tagName===‘script‘?‘src‘:‘href‘;
ele[typeProp] = url;
parentEle.appendChild(ele);
}
第一种情况用法非常简单就不说了。
第二种用法其实也不难：
假设：scripts数组：[‘a.js‘,‘b.js‘,‘c.js‘]
var i=0;
var n=scripts.length;
loadScript(scripts[i],parentEle,‘script‘,loadScriptComplete);
function loadScriptComplete(){
i++;
if(i<n){
loadScript(scripts[i],parentEle,‘script‘,loadScriptComplete);
}
}
上面的两种方法其实也适用于加载css文件。
标签：
原文地址：http://www.cnblogs.com/ywxgod/p/4196896.html
