Jquery中$(document).ready()的作用類似於傳統JavaScript中的window.onload方法，不過相比較而言還是有區別的。
1.執行時機
window.onload()是必須等圖片在內的一切元素載入完成後才能執行。
$(document).ready()是當DOM結構完成後就執行，不必等到全部元素載入完畢。
2.編寫個數
window.onload()只能編寫一個，當寫多個的時候會把前面所寫的覆蓋，只執行一個。
$(document).ready()可以寫多個，並且可以同時執行。
3.簡化寫法
window.onload沒有簡化寫法
$(document).ready(function(){})可以簡寫成$(function(){});
| window.onload() | $(document).ready() | |
|---|---|---|
| 執行時機 | 必須等待網頁中所有的內容載入完畢後(包括圖片)才能執行 | 網頁中所有DOM結果繪製完畢後就執行，可能DOM元素關聯的東西並沒有載入完 |
| 編寫個數 |
不能同時編寫多個
以下程式碼無法正確執行：
window.load = function() {
alert("test1");
};
window.load = function() {
alert("test2");
};
結果只會輸出“test2”
|
能同時編寫多個
以下程式碼可以正確執行：
$(document).ready(function(){
alert("Hello World!");
});
$(document).ready(function(){
alert("Hello again!");
});
結果兩次都輸出 |
| 簡化寫法 | 沒有簡化寫法 | $(document).ready(function(){
...
});
可以簡寫成：
$(function(){
...
}); |