中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

JS異步加載的三種實現方式

發布時間:2020-09-15 19:00:09 來源:腳本之家 閱讀:216 作者:Walker-lyl 欄目:web開發

js加載的缺點:加載工具方法沒必要阻塞文檔,過多js加載會影響頁面效率,一旦網速不好,那么整個網站將等待js加載而不進行后續渲染等工作。 有些工具方法需要按需加載,用到再加載,不用不加載,。

默認正常模式下下,JS是同步加載的,即優先加載JS,只有當JS文件下載完,dom和css才開始加載,當某些時候我們需要JS異步加載,我們可以通過以下方式來設置異步加載,不同情況下選取不同方式即可

1.defer:defer

  1. JS異步下載,dom結構解析完(標簽 + 樣式(內容不一定下載完))才異步執行 
  2. 僅IE能用
  3. 內部JS也能用該屬性
  4. 異步加載js不允許使用document.write,因為document.write會清除文檔流,js標簽還未加載就會被清除
  5. document.write()可用于初始化頁面

2.(h6)async:async(asynchronous) ajax(asynchronous javascript and XML)

  1. JS異步加載,加載完畢后立刻異步執行
  2. IE8及以下不兼容
  3. 內部JS不能用該屬性

3.除了以上兩種方法,還有一種兼容自己封裝的異步加載方式,即動態添加script標簽也能實現異步加載。

function asyncLoaded(url,callBack){/*url為js的鏈接,callBack為url的js中的函數(該函數調用應該寫到匿名函數中,如function(){console.log(div.getScrollOffset())})*/
  var script = document.createElement('script');
  script.type = 'text/javascript';
  /*if else 這幾句話必須要寫到這位置處,不能放最后,因為if中js加載中script.readyState存在好幾種狀態,
  只有狀態改變‘readystatechange'事件才會觸發,但現在瀏覽器加載速度很快,當解析到該事件時JS有可能已經加載完,
  所以事件根本不會觸發,所以要寫到前面*/
  if(script.readystate){//兼容IE
    script.onreadystatechange = function() {//狀態改變事件才觸發
      if(script.readyState == 'loaded' || script.readyState == 'complete'){  
        callBack();
        script.onreadystatechange = null;    
      }
    }
  }else{
    script.onload = function(e){
      callBack();
    }
  }    
  script.src = url;
  document.body.appendChild(script);
}

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持億速云。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

彝良县| 鹤壁市| 泰和县| 宝坻区| 临猗县| 石河子市| 广宗县| 万安县| 遂川县| 尚义县| 甘谷县| 泗洪县| 昭通市| 大同县| 商水县| 台江县| 高碑店市| 和平县| 阜康市| 内丘县| 永济市| 南靖县| 永丰县| 凤阳县| 兰溪市| 获嘉县| 樟树市| 桦川县| 丹东市| 芷江| 布尔津县| 宣威市| 化州市| 兰考县| 香河县| 彰化市| 石门县| 缙云县| 酒泉市| 汝城县| 韩城市|