首頁  >  文章  >  web前端  >  一張表格告訴你windows.onload()與$(document).ready()的區別_jquery

一張表格告訴你windows.onload()與$(document).ready()的區別_jquery

WBOY
WBOY原創
2016-05-16 16:48:021227瀏覽

瀏覽器載入完DOM後,會透過javascript為DOM元素加入事件,在javascript中,通常使用window.onload()方法。

在jquery中,則使用$(document).ready()方法。下面介紹一下兩者的差異。

  window.onload() $(document).ready()
執行時機 在頁面所有元素(包括圖片,引用檔案)載入後執行。
  window.onload() $(document).ready()
执行时机 在页面所有元素(包括图片,引用文件)加载完后执行。

页面中所有HTML DOM,CSS DOM结构加载完之后就会执行,其他图片可能没有加载完.

如果想要网页所有内容(包括图片等)加载完毕,再注册事件,使用$(window).load(function);

等价于window.onload()

编写个数

不能同时写多个,后面的将会覆盖前面的。ex:

window.onload=function(){ alert("A"); }

window.onload=function(){ alert("B"); }

结果会执行“B”

如果想要顺序执行alert("A")和alert("B")需写成

window.onload=function(){

alert("A");

alert("B");

}

可以同时写多个
简写

$(document).ready(function(){

  //to do;

});

可写成

$().ready(function(){ //$()不带参数默认是document

  //to do;

});或

$(function(){

  //to do;

});

 

頁中所有HTML DOM,CSS DOM結構載入完之後就會執行,其他圖片可能沒有載入完. 如果想要網頁所有內容(包括圖片等)加載完畢,再註冊事件,使用$(window).load(function); 等價於window.onload()
寫個數 不能同時寫多個,後面的將會覆蓋前面的。 ex: window.onload=function(){ alert("A"); } window.onload=function(){ alert("B"); } 結果會執行「B」 如果想要順序執行alert("A")和alert("B")需寫成 window.onload=function(){ alert("A"); alert("B"); } 可以同時寫多個
簡寫 $(document).ready(function(){   //to do; }); 可寫成 $().ready(function(){ //$()不帶參數預設是document   //to do; });或 $(function(){   //to do; });  
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn