$(document).ready()和window.onload的區別

 

 

下面我簡單記錄一下在html中jquery裏面的$(document).ready()和window.onload的區別，主要有三個不一樣的方面：

 

• $(document).ready()比window.onload更快加載
• $(document).ready()有簡寫方式，window.onload沒有簡寫
• $(document).ready()能夠重複執行，window.onload只會執行一次

 

1、

$(document).ready()在dom文檔樹加載完以後執行一個函數（注意，這裏面的文檔樹加載完不表明所有文件加載完）。window.onload是在dom文檔樹加載完和全部文件加載完以後執行一個函數。因此說$(document).ready要比window.onload先執行。

效果動圖：

 

2、

$(document).ready()的簡寫格式是：$(function(){}),

window.onload沒有簡寫

 

3、

同時在同一個HTML頁面中使用多個$(document).rady(),函數會一次所有都執行。

同時在同一個HTML頁面中使用多個window.onload，只會執行最後一個函數。

 

效果動圖：

兩個window.onload加載效果以下：

 

上面的效果圖能夠看到只有第二個onload加載出來了。

 

兩個$(document).ready()加載效果以下：

能夠看到上面效果圖兩個函數都相應的執行了

 

 

注：雖然這裏我測試的執行的順序是沒問題的，可是有時候偶爾onload會比ready更早的執行，我也不知道什麼緣由，但願有大神能夠幫我解答一下