javascript实现动态导入js与css等静态资源文件的方法
本文实例讲述了javascript实现动态导入js与css等静态资源文件的方法。分享给大家供大家参考。具体实现方法如下:
/**
*动态导入静态资源文件js/css
*/
var$import=function(){
returnfunction(rId,res,callback){
if(res&&'string'==typeofres){
if(rId){
if($($('#'+rId),$('head')).length>0){
return;
}
}
//加载资源文件
varsType=res.substring(res.lastIndexOf('.')+1);
//支持js/css
if(sType&&('js'==sType||'css'==sType)){
varisScript=(sType=='js');
vartag=isScript?'script':'link';
varhead=document.getElementsByTagName('head')[0];
//创建节点
varlinkScript=document.createElement(tag);
linkScript.type=isScript?'text/javascript':'text/css';
linkScript.charset='UTF-8';
if(!isScript){
linkScript.rel='stylesheet';
}
isScript?linkScript.src=res:linkScript.href=res;
if(callback&&'function'==typeofcallback){
if(linkScript.addEventListener){
linkScript.addEventListener('load',function(){
callback.call();
},false);
}elseif(linkScript.attachEvent){
linkScript.attachEvent('onreadystatechange',function(){
vartarget=window.event.srcElement;
if(target.readyState=='complete'){
callback.call();
}
});
}
}
head.appendChild(linkScript);
}
}
};
}();
希望本文所述对大家的javascript程序设计有所帮助。