jQuery $(document).ready() 與window.onload的不同

jQuery優勢

1、輕量級 2、強大的選擇器

3、出色的DOM操作 4、可靠的事件處理機制 5、完善的Ajax 6、不污染頂級變量 7、出色的浏覽器相容性，支援IE6.0+、Firefox3.6+、Safari5.0+、Opera、Chrome 8、鍊式操作方式 9、隐式疊代 10、行為層與結構層的分離 11、豐富的插件支援 12、完善的文檔 13、開源 jQuery代碼的編寫 在jQuery庫中，$就是就jQuery的一個簡寫形式，$("#foo")和jQuery("#foo")是等價的 規範： 1、對于同一個對象不超過3個操作的，可以直接寫在一行 2、對于同一個對象的較多操作，建議每行寫一個操作 3、對于多個對象的少量操作，可以每個對象寫一行，涉及子元素的，可以考慮縮進 建議：jQuery對象使用$開頭，例：var $variable = jQuery對象，var variable= DOM對象

現在進入正題，來說說 頁面加載完成的兩種事件： window.onload 與 $(document).ready() 的不同

window.onload	$(document).ready()
執行時機	必須等網頁中所有的内容加載完畢後（包括圖檔）才能執行	網頁中所有DOM結構繪制完畢後就執行，可能DOM元素關聯的東西并沒有加載完
編寫個數	不能同時編寫多個，即一個頁面隻能加載一個window.onload，  如果有多個，則會被最新的覆寫。         以下代碼無法正确執行：         window.onload = function(){                alert("ZZ");         };         window.onload = function(){                alert("W");         };       結果隻能輸出 "W"	能同時編寫多個。以下代碼正确執行：     $(document).ready(function(){           alert("ZZ");     });     $(document).ready(function(){           alert("W");     });      結果兩次都會輸出: 先輸出"ZZ",再輸出"W"
簡化寫法	無	$(document).ready(function(){            //·····       });          可以簡寫為:       $(function(){               //·····       });

注：一般情況一個頁面響應加載的順序是：域名解析 --> 加載html --> 加載js和css --> 加載圖檔等其他資訊。

那麼window.onload 應該在 “加載圖檔等其他資訊” 之後才可以操作DOM； 而$(document).ready() 在 “加載js和css”和“加載圖檔等其他資訊”之間，就可以操作Dom。