亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

JS 動態(tài)加載js文件和css文件 同步/異步的兩種簡單方式

 更新時間:2016年09月23日 07:47:27   投稿:jingxian  
下面小編就為大家?guī)硪黄狫S 動態(tài)加載js文件和css文件 同步/異步的兩種簡單方式。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
/*動態(tài)添加js或css,URL:文件路徑,F(xiàn)ileType:文件類型(js/css)*/
function AddJsFiles(URL,FileType){
  var oHead = document.getElementsByTagName('HEAD').item(0);
  var addheadfile;
  if(FileType=="js"){
    addheadfile= document.createElement("script");
    addheadfile.type = "text/javascript";
    addheadfile.src=URL;
  }else{
    addheadfile= document.createElement("link");
    addheadfile.type = "text/css";
    addheadfile.rel="stylesheet";
    addheadfile.rev = "stylesheet";
    addheadfile.media = "screen";
    addheadfile.href=URL;
  }
  oHead.appendChild( addheadfile);
}
/*方法調(diào)用*/
AddJsFiles("js/index.js","js");
AddJsFiles("css/index.css","css");

經(jīng)測試發(fā)現(xiàn)以上方法進(jìn)行文件加載時,文件是異步加載的,這樣就可能導(dǎo)致加載文件后立即使用文件中的方法或變量會產(chǎn)生錯誤的情況,

所以以下采用同步加載的方法,當(dāng)文件加載完成后再去執(zhí)行相應(yīng)的代碼或方法

/*5.加載文件*/
/* 已加載文件緩存列表,用于判斷文件是否已加載過,若已加載則不再次加載*/
var classcodes =[];
window.Import={
  /*加載一批文件,_files:文件路徑數(shù)組,可包括js,css,less文件,succes:加載成功回調(diào)函數(shù)*/
  LoadFileList:function(_files,succes){
    var FileArray=[];
    if(typeof _files==="object"){
      FileArray=_files;
    }else{
      /*如果文件列表是字符串,則用,切分成數(shù)組*/
      if(typeof _files==="string"){
        FileArray=_files.split(",");
      }
    }
    if(FileArray!=null && FileArray.length>0){
      var LoadedCount=0;
      for(var i=0;i< FileArray.length;i++){
        loadFile(FileArray[i],function(){
          LoadedCount++;
          if(LoadedCount==FileArray.length){
            succes();
          }
        })
      }
    }
    /*加載JS文件,url:文件路徑,success:加載成功回調(diào)函數(shù)*/
    function loadFile(url, success) {
      if (!FileIsExt(classcodes,url)) {
        var ThisType=GetFileType(url);
        var fileObj=null;
        if(ThisType==".js"){
          fileObj=document.createElement('script');
          fileObj.src = url;
        }else if(ThisType==".css"){
          fileObj=document.createElement('link');
          fileObj.href = url;
          fileObj.type = "text/css";
          fileObj.rel="stylesheet";
        }else if(ThisType==".less"){
          fileObj=document.createElement('link');
          fileObj.href = url;
          fileObj.type = "text/css";
          fileObj.rel="stylesheet/less";
        }
        success = success || function(){};
        fileObj.onload = fileObj.onreadystatechange = function() {
          if (!this.readyState || 'loaded' === this.readyState || 'complete' === this.readyState) {
            success();
            classcodes.push(url)
          }
        }
        document.getElementsByTagName('head')[0].appendChild(fileObj);
      }else{
        success();
      }
    }
    /*獲取文件類型,后綴名,小寫*/
    function GetFileType(url){
      if(url!=null && url.length>0){
        return url.substr(url.lastIndexOf(".")).toLowerCase();
      }
      return "";
    }
    /*文件是否已加載*/
    function FileIsExt(FileArray,_url){
      if(FileArray!=null && FileArray.length>0){
        var len =FileArray.length;
        for (var i = 0; i < len; i++) {
          if (FileArray[i] ==_url) {
            return true;
          }
        }
      }
      return false;
    }
  }
}

var FilesArray=["js/index.js","js/ClassInherit1.js","js/highcharts_2.21.js","css/index.css"];
Import.LoadFileList(FilesArray,function(){
  /*這里寫加載完成后需要執(zhí)行的代碼或方法*/
});

以上就是小編為大家?guī)淼腏S 動態(tài)加載js文件和css文件 同步/異步的兩種簡單方式的全部內(nèi)容了,希望對大家有所幫助,多多支持腳本之家~

相關(guān)文章

最新評論