欧美亚洲中文,在线国自产视频,欧洲一区在线观看视频,亚洲综合中文字幕在线观看

      1. <dfn id="rfwes"></dfn>
          <object id="rfwes"></object>
        1. 站長(zhǎng)資訊網(wǎng)
          最全最豐富的資訊網(wǎng)站

          jquery $(document).ready()和onload的區(qū)別是什么

          區(qū)別:window.onload沒有簡(jiǎn)化寫法,必須等到頁(yè)面內(nèi)包括圖片的所有元素加載完畢后才能執(zhí)行。而“$(document).ready()”可以簡(jiǎn)寫成“$(function(){})”,它是DOM結(jié)構(gòu)繪制完畢后就執(zhí)行,不必等到加載完畢。

          jquery $(document).ready()和onload的區(qū)別是什么

          推薦教程:jquery視頻教程

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

          1.執(zhí)行時(shí)間

          window.onload必須等到頁(yè)面內(nèi)包括圖片的所有元素加載完畢后才能執(zhí)行。
          $(document).ready()是DOM結(jié)構(gòu)繪制完畢后就執(zhí)行,不必等到加載完畢。

          2.編寫個(gè)數(shù)不同

          window.onload不能同時(shí)編寫多個(gè),如果有多個(gè)window.onload方法,只會(huì)執(zhí)行一個(gè)

          $(document).ready()可以同時(shí)編寫多個(gè),并且都可以得到執(zhí)行

          3.簡(jiǎn)化寫法

          window.onload沒有簡(jiǎn)化寫法

          $(document).ready(function(){})可以簡(jiǎn)寫成$(function(){});

          說明:

          以瀏覽器裝載文檔為例,在頁(yè)面加載完畢后,瀏覽器會(huì)通過JavaScript為DOM元素添加事件。在常規(guī)的JavaScript代碼中,通常使用window.onload方法,而在jQuery中,使用的是$(document).ready()方法。

          $(document).ready()方法和window.onload方法有相似的功能,但是在執(zhí)行時(shí)機(jī)方面是有區(qū)別的。window.onload方法是在網(wǎng)頁(yè)中所有的元素(包括元素的關(guān)聯(lián)文件)完全加載到瀏覽器后才執(zhí)行,即JavaScript此時(shí)才可以訪問網(wǎng)頁(yè)中的任何元素。而通過jQuery中的$(document).ready()方法注冊(cè)的事件處理程序,可以在DOM完全就緒時(shí)就可以被調(diào)用。此時(shí),網(wǎng)頁(yè)的所有元素對(duì)jQuery而言都是可以訪問的,但是,這并不意味著這些元素關(guān)聯(lián)的文件都已經(jīng)下載完畢。

          舉一個(gè)例子,有一個(gè)大型的圖庫(kù)網(wǎng)站,為網(wǎng)頁(yè)中所有圖片添加某些行為,例如單擊圖片后讓它隱藏或顯示。如果使用window.onload方法來處理,那么用戶必須等到每一幅圖片都加載完畢后,才可以進(jìn)行操作。如果使用jQuery中的$(document).ready()方法來進(jìn)行設(shè)置,只要DOM就緒時(shí)就可以操作了,不需要等待所有圖片下載完畢。很顯然,把網(wǎng)頁(yè)解析為DOM樹的速度比把網(wǎng)頁(yè)中的所有關(guān)聯(lián)文件加載完畢的速度快很多。

          另外需要注意一點(diǎn),由于在$(document).ready()方法內(nèi)注冊(cè)的事件,只要DOM就緒就會(huì)被執(zhí)行,因此可能此時(shí)元素的關(guān)聯(lián)文件未下載完。例如與圖片有關(guān)的HTML下載完畢,并且已經(jīng)解析為DOM樹了,但很有可能圖片還未加載完畢,所以例如圖片的高度和寬度這樣的屬性此時(shí)不一定有效。要解決這個(gè)問題,可以使用JQuery中另一個(gè)關(guān)于頁(yè)面加載的方法——load()方法。load()方法會(huì)在元素的onload事件中綁定一個(gè)處理函數(shù)。如果處理函數(shù)綁定給window對(duì)象,則會(huì)在所有內(nèi)容(包括窗口、框架、對(duì)象和圖像等)加載完畢后觸發(fā),如果處理函數(shù)綁定在元素上,則會(huì)在元素的內(nèi)容加載完畢后觸發(fā)。jQuery代碼如下:

          $(window).load(function () {     //編寫代碼 })

          等價(jià)與javaScript中的以下代碼:

          window.onload = function () {     //編寫代碼 }

          假設(shè)網(wǎng)頁(yè)中有兩個(gè)函數(shù),JavaScript代碼如下:

          function one() {     alert("one"); } function two() {     alert("two"); }

          當(dāng)網(wǎng)頁(yè)加載完畢后,通過Javascript代碼來分別調(diào)用one函數(shù)和two函數(shù):

          window.onload = one; window.onload = two;

          然而當(dāng)運(yùn)行代碼后,發(fā)現(xiàn)只彈出字符串“two”對(duì)話框。

          字符串“one”對(duì)話框不能被彈出的原因是JavaScript的onload事件一次只能保存在一個(gè)函數(shù)的引用,它會(huì)自動(dòng)用后面的函數(shù)覆蓋前面的函數(shù),因此不能在現(xiàn)有的行為上添加新的行為。

          為了達(dá)到兩個(gè)函數(shù)順序觸發(fā)的效果,只能在創(chuàng)建一個(gè)新的JavaScript方法來實(shí)現(xiàn),JavaScript代碼如下:

          window.onload = function () {     one();     two(); }

          雖然這樣編寫的代碼能解決某些問題,但還是不能滿足某些需求,例如有多個(gè)JavaScript文件,每個(gè)文件都需要用到window.onload方法,這種情況下用上面提到的方法編寫代碼會(huì)非常麻煩。你可以參考Javascript共享onload事件,而jQuery的$(document).ready()方法能夠很好地處理這些情況,每次調(diào)用$(document).ready()方法都會(huì)在現(xiàn)有的行為上追加新的行為,這些行為函數(shù)會(huì)根據(jù)注冊(cè)的順序依次執(zhí)行。例如如下jQuery代碼:

          function one() {     alert("one"); } function two() {     alert("two"); } $(document).ready(function () {     one(); }); $(document).ready(function () {     two(); })

          運(yùn)行代碼后,會(huì)彈出字符串“one”對(duì)話框,然后彈出字符串“two”對(duì)話框

          贊(0)
          分享到: 更多 (0)
          網(wǎng)站地圖   滬ICP備18035694號(hào)-2    滬公網(wǎng)安備31011702889846號(hào)