document.ready和window.onload的區(qū)別

小樊
83
2024-07-02 04:49:40

document.ready和window.onload都是用來(lái)在頁(yè)面加載完畢后執(zhí)行JavaScript代碼的方法，但是它們之間有一些區(qū)別：

  1. 觸發(fā)時(shí)機(jī)：
  • document.ready：document.ready是jQuery庫(kù)中的方法，它會(huì)在DOM樹加載完畢后就會(huì)執(zhí)行，即在頁(yè)面元素加載完畢后就可以執(zhí)行JavaScript代碼。
  • window.onload：window.onload是原生JavaScript中的方法，它會(huì)在整個(gè)頁(yè)面（包括圖片和其他資源）加載完畢后才會(huì)執(zhí)行，即在所有元素加載完畢后才可以執(zhí)行JavaScript代碼。
  1. 多次綁定：
  • document.ready：document.ready可以多次綁定，即在頁(yè)面中多次使用$(document).ready()來(lái)綁定多個(gè)事件處理程序。
  • window.onload：window.onload只能綁定一個(gè)事件處理程序，即多次使用window.onload會(huì)覆蓋前面的事件處理程序。
  1. 兼容性：
  • document.ready：document.ready是jQuery庫(kù)中的方法，需要引入jQuery庫(kù)才能使用。
  • window.onload：window.onload是原生JavaScript中的方法，不需要引入任何外部庫(kù)就可以使用。

綜上所述，document.ready在DOM樹加載完畢后就執(zhí)行，而window.onload在整個(gè)頁(yè)面加載完畢后才執(zhí)行。如果只需要在DOM樹加載完畢后執(zhí)行代碼，可以使用document.ready；如果需要等待所有頁(yè)面元素加載完畢后再執(zhí)行代碼，可以使用window.onload。

0 踩