jQuery中的read和JavaScript中的onload函數的差異_jquery

在JavaScript中，onload函數是最常使用的，幾乎涉及JavaScript的童鞋都少不了要接觸它。這個函數的作用就是等待網頁完全裝載完了以後再去執行程式碼區塊內的語句，因為按照文檔流程的執行順序，通常用於頭部載入JavaScript的時候需要用到。

複製程式碼 程式碼如下:

window.onload = function(){
    // 當網頁載入完成後執行這裡的程式碼區塊
};

而在jQuery中也有一個對應的函數，就是等待網頁載入完後執行程式碼區塊

複製程式碼 程式碼如下:

$(document).ready(function(){
    // 當網頁載入完成後執行這裡的程式碼區塊    
});

以上這兩個看似一樣的功能，但實際上有很大的差別。

onload不僅在創建DOM樹之後，而且在所有外部資源全部加載完畢，並且整個頁面在瀏覽器視窗中顯示完畢之後，才會執行。這些資源不僅包括圖片資源，而且包括嵌入在頁面上的flash視頻，如果圖片或者flash過多，那麼會一段很長加載時間，也就意味這延遲執行代碼塊的時間會更多。

jQuery中的ready()方法只需要等待文檔結構被完全解析並且瀏覽器已經把HTML轉化為DOM樹後就會執行程式碼區塊，這裡註意的是僅僅是DOM，網頁中的圖片，flash等外部資源都毫無關聯。

由此可見jQuery中的ready()方法將縮短等待時間。

當然還有另一種方式，就是把腳本都在

標籤後面，這樣的話網頁按照文檔流順序執行，也會達到JavaScript中onload或者jQuery中ready()效果，並且這中方式將更快的展現網頁內容。