javascript原生判斷DOM是否載入完畢執行方法

readyState

document.readyState 返回當前文檔的狀態
屬性如下：

1. uninitialized 還未開始載入
2. loading 載入中
3. interactive 已載入，文檔與用戶可以開始交互
4. complete 載入完成

DOMContentLoaded

當 DOMContentLoaded事件觸發時，僅當DOM載入完成，不包括樣式表，圖片，flash

onload

當 onload 事件觸發時，頁面上所有的DOM，樣式表，腳本，圖片，flash都已經載入完成了

根據執行時DOM是否已經裝載完畢來決定是對回調函數進行同步調用還是非同步調用。具體代碼如下：

function onReady(fn){
    var readyState = document.readyState;
    if(readyState === 'interactive' || readyState === 'complete') {
    fn()
  }else{
      window.addEventListener("DOMContentLoaded",fn);
    }

}

onReady(function(){
  console.log('DOM fully loaded and parsed ');
  })

文章轉載地址：https://www.jianshu.com/p/fe4bea649473