溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
JQ中的$(document).ready()大家應該用的非常多，基本每個JS腳本中都有這個函數的出現有時甚至會出現多個，那么另一個加載函數$(window).load相對出現的次數就很少了，下面為大家介紹一下兩者的區別與他們的執行順序
一般情況下一個頁面響應加載的基本順序是：域名解析 -> 加載html -> 加載js和css -> 加載圖片等其他信息。
那么我們在編寫JS腳本時什么情況下使用$(document).ready()又在什么情況下使用$(window).load呢，我們先來了解一下兩者的功能
一、$(document).ready()
從字面的意思上理解，就是文檔準備好了。也就是瀏覽器已經加載并解析完整個html文檔，dom樹已經建立起來了,然后執行此函數
原生JavaScript中的寫法如下：
document.ready=function(){
alert("ready");
}
jQuery中的寫法如下：
$(document).ready(function(){
alert("ready");
});
或
$(function(){
alert("ready");
});
二、$(window).load
在網頁中所有元素(包括頁面中圖片,css文件等所有關聯文件)完全加載到瀏覽器后才執行
原生JavaScript中的寫法如下：
window.onload = function(){
alert("onload");
};
jQuery中的寫法如下：
$(window).load(function(){
alert("onload");
});
兩者的區別在于：
1.執行時間不同
$(document).ready()是在頁面完成HTML的加載并建立了DOM樹之后就開始執行，但這并不代表頁面的所
有數據已經全部加載完成，一些大的圖片有會在建立DOM樹之后很長一段時間才行加載完成，而
$(window).load()就是整個頁面已經加載完畢后才執行，包括圖片等一些關聯文件。
2.可以被執行的次數不同
$(document).ready()可以在JavaScript代碼中出現多次，并且里面的函數或者代碼都可以執行；而$(window).load()只能在JavaScript代碼中出現一次，如果有多個$(window).load()，那么只有最后一個$(window).load()里面的函數或者代碼才會執行，之前的$(window).load()都將被覆蓋;
3.執行的效率不同
如要在dom的元素節點中添加onclick屬性節點，這時用$(document).ready()就要比用$(window).load()的效率高；但是在某些時候還必須得用$(window).load()才行
總結一下就是：$(window).load()在$(document).ready之后執行，且頁面中所有內容全部加載完成后才會執行，兩者的使用時機一目了然，大家可以自行決定。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
