近期承擔了部分jquery的任務,在部落格總結一下,留作積累,用得上的親也可參考。
首先說說window和document,直觀上來講,window代表的是瀏覽器視窗,而document代表的是瀏覽器視窗中載入的dom元素。假設現在有乙個瀏覽器,裡邊載入的頁面特別長,已經超出了一屏,當然,肯定會出現滾動條了,這時候,$(window).height()和$(document).height()是不相等的,document的高度肯定要比window的大,因為window視窗始終就是那麼大。
然後介紹一下什麼是jquery中的load和ready事件。
load事件主要就是用來代替原生的window.onload,它只能用在兩個場景下:
· window物件上。比如$(window).load(fn);。
· 帶有url的元素(images, scripts, frames, iframes)。比如$(「img」).load(fn); //jquery官方文件明確說明load事件的跨瀏覽器相容性很差,谷歌瀏覽器僅僅支援$(window).load(fn);,而火狐瀏覽器支援$(window).load(fn);和$(「img」).load(fn)
除此之外,任何元素都沒有load事件,比如:$(document).load(fn);這是錯誤的寫法,根本不會執行。
ready事件可以加在任意元素上,比如$(window).ready(fn);、$(document).ready(fn);、$(「div」).ready(fn);等等
·$(document).ready()在單個頁面中可以執行多個。例如有多個 js 檔案,每個檔案都需要用到window.onload 方法,這種情況下用onload方法編寫**會非常麻煩,而 jquery 的 $(document).ready() 方法能夠很好地處理這些情況,每次呼叫 $(document).ready() 方法都會在現有的行為上追加新的行為,這些行為函式會根據註冊的順序依次執行。
·onload 在乙個頁面中只能執行乙個。如果有多個,它會自動用後面的函式覆蓋前面的函式。
$(window).load(function ());
等價於window.onload = function ()
$(document).ready(fucntion());
等價於$(function());
等價於$(jquery.function($));
ready事件與window.onload(或)是衝突的,如果使用了window.onload(或),將導致ready事件不執行。
jquery新版本已經不再進行ie低版本(ie6、ie7、ie8)的相容性處理。如果要相容ie8版本以下,就不能使用ready事件。要解決這個問題,可以使用 jquery 中另乙個關於頁面載入的方法—— load() 方法。load() 方法會在元素的 onload 事件中繫結乙個處理函式。如果處理函式繫結給 window 物件,則會在所有內容(包括視窗、框架、物件和影象等)載入完畢後觸發,如果處理函式繫結在元素上,則會在元素的內容載入完畢後觸發。
jQuery中ready和load的區別
ready方法 document ready function document ready 簡寫 function load方法 window load function 1 解析html結構 2 載入外部指令碼和樣式檔案 3 解析並執行指令碼 4 構造html dom模型 ready 5 載入等...
jquery中load和ready的區別
首先是寫法 load window.onload window 是bom操作的核心物件。ready document ready function 執行的 塊 jquery簡寫 function 經常會被問到他們倆個哪個先執行 首先,明確的說明是ready先執行 先了解下乙個頁面的載入順序 1.解析...
jQuery中ready與load事件的區別
1 2 3 4 5 6 7 8 document ready document ready function document ready 簡寫 function 有些時候也會這麼寫 1 2 3 4 document load document load function 乙個是ready乙個是lo...