轉自:http://holysonll.blog.163.com/blog/static/2141390932013411112823855/ document.ready和onload的區別——JavaScript文檔載入完成事件 頁面載入完成有兩種事件 一是ready,表示文檔結構已經載入完成( ...
轉自:http://holysonll.blog.163.com/blog/static/2141390932013411112823855/
document.ready和onload的區別——JavaScript文檔載入完成事件 頁面載入完成有兩種事件 一是ready,表示文檔結構已經載入完成(不包含圖片等非文字媒體文件) 二是onload,指示頁麵包含圖片等文件在內的所有元素都載入完成。 用jQ的人很多人都是這麼開始寫腳本的: $(function(){ // do something }); 其實這個就是jq ready()的簡寫,他等價於:
$(document).ready(function(){ //do something }) //或者下麵這個方法,jQuer的預設參數是:“document”;
$().ready(function(){ //do something }) 這個就是jq ready()的方法就是Dom Ready,他的作用或者意義就是:在DOM載入完成後就可以可以對DOM進行操作。 一般情況先一個頁面響應載入的順序是:功能變數名稱解析-載入html-載入js和css-載入圖片等其他信息。 那麼Dom Ready應該在“載入js和css”和“載入圖片等其他信息”之間,就可以操作Dom了。 以上還是本人新手時寫的。。。感覺大家閱讀,5000+的閱讀量鄙人在此就加點內容吧,不讓廣大技術朋友白支持!! 2014-8-18 -----鄙人現在已經不算新手了,在此給大家再深入說點內容吧。 1.window.onload方法 ⑴執行時機: 在網頁中所有元素(包括元素的所有關聯文件)完全載入到瀏覽器後才執行,即JavaScript 此時可以訪問網頁中的所有元素。 window.onload=function(){ $(window).load(function(){ //編寫代碼 等價於 //編寫代碼 } }); ⑵多次使用: JavaScript的onload事件一次只能保存對一個函數的引用,他會自動用最後面的函數覆蓋前面的函數。
function one(){
alert("one");
}
function two(){
alert("two");
}
window.onload=one;
window.onload=two;
//運行代碼後只有 two
2.$(document).ready()方法 ⑴執行時機:在DOM完全就緒時就可以被調用。(這並不意味著這些元素關聯的文件都已經下載完畢) 舉個例子:$(document).ready()方法明知要DOM就緒就可以操作了,不需要等待所有圖片下載完畢。 ⑵多次使用:function one(){
alert("one");
}
function two(){
alert("two");
}
$(document).ready(function(){
one();
});
$(document).ready(function(){
two();
});
//運行代碼後
//先是:one
//後是:two