實現在html頁面載入之前執行js方法
瀏覽器對html頁面內容的載入是順序載入,也就是在html頁面中前面先載入,因此當載入到JS指令碼時,JS是一種解釋性的指令碼,也是從上而下順序執行,由於這段JS程式碼是立即執行的。
第一種方式是把方法寫在head中(推薦)
讓它順序執行的時候去執行。
第二種方式是使用body的onload方法
- 第三種方式是使用$(document).ready()
引用
JQuery 中用得最多的要屬工廠函式 $() 了,下面我們就來看一下它的初步應用。
大家知道,在 JQuery 中我們可以使用 $(document).ready(); 在其中加入頁面載入後的程式碼,以便做出豐富的頁面行為。
它和傳統的 JS 中的 onload 有什麼區別呢?
onload ready 沒有簡寫方式 具有簡寫方式 當 HTML 頁面所有內容載入完畢後才執行 onload 當 DOM
節點載入完畢後就執行 ready 一個 HTML 頁面只能編寫一個 onload 一個 HTML 頁面允許同時編寫多個 ready傳統的 window 的 onload 程式如下:
window.onload = function() { }
它是在整個頁面完全被載入之後執行。
這樣做最大的一個缺點就是速度問題,onload 中的程式碼不僅是在構建 DOM 樹之後,而且是在所有影象和其它外部資源被完整地載入
並在頁面瀏覽器視窗顯示完畢之後才執行。
而 $(document).ready() 最大地優點就是在瀏覽器構建 DOM 樹之後立即執行其中的程式碼。
(document).ready()的寫法比較正式,用得比較多的寫法還可以是: (), 你可以在括號中直接加你的匿名函式,如下:$(function() { });
和
$(document).ready(function() { });
或
$().ready(function(){ });
都是正確的。