前端中onload與ready的區別

 

Jquery的ready()與Javascrpit的load()

 

1	window.onload()	$(document).ready()
加載時機	必須等待網頁所有加載完畢（包括圖片等），而後再執行JS代碼	只須要等待網頁中的DOM結構加載完畢，就能執行JS代碼
執行次數	只能執行一次，若是第二次，那麼第一次的執行會被覆蓋	能夠執行屢次，第N次都不會被上一次覆蓋
舉例	如下代碼沒法正確執行： window.onload = function() { alert(「text1」);};   window.onload = function() { alert(「text2」);}; 結果只輸出第二個	結果只輸出第二個 $(document).ready(function(){alert(「Hello」)});   $(document).ready(function(){alert(「Hello」)}); 結果兩次都輸出
簡寫方案	無	$(function () {})

 

通常狀況下window的load()都是用來設置body標籤的onload事件.但onload事件是要在頁面的元素所有加載完了才觸發的,這也包括頁面上的圖片，以及大的表格數據。若是頁面上圖片較多或圖片太大,加載須要較多時間，就會致使頁面無響應，或者用戶作了其它操做了。

而Jeuery中的ready()則是在頁面的dom(節點)加載完後就能夠作相應的操做,而不用等待所有元素加載完成.好比只知道頁面某處有一張圖片，而不必定要等它顯示出來就能夠爲它綁定點擊方法。

 

https://www.cnblogs.com/wsun/p/3916487.html