javascript实现动态导入js与css等静态资源文件的方法

本文实例讲述了javascript实现动态导入js与css等静态资源文件的方法。分享给大家供大家参考。具体实现方法如下：

var $import = function(){
  return function(rId, res, callback){
    if(res && 'string' == typeof res){
      if(rId){
 if($($('#' + rId), $('head')).length>0){
   return;
 }
      }
      //加载资源文件
      var sType = res.substring(res.lastIndexOf('.') + 1);
      // 支持js/css
      if(sType && ('js' == sType || 'css' == sType)){
 var isscript = (sType == 'js');
 var tag = isscript ? 'script' : 'link';
 var head = document.getElementsByTagName('head')[0];
 // 创建节点
 var linkscript = 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' == typeof callback){
   if (linkscript.addEventListener){
     linkscript.addEventListener('load', function(){
callback.call();
     }, false);
   } else if (linkscript.attachEvent) {
     linkscript.attachEvent('onreadystatechange', function(){
var target = window.event.srcElement;
if (target.readyState == 'complete') {
  callback.call();
}
     });
   }
 }
 head.appendChild(linkscript);
      }
    }
  };
}();

希望本文所述对大家的javascript程序设计有所帮助。