第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

js 自執(zhí)行函數(shù)可否代替onload事件?

js 自執(zhí)行函數(shù)可否代替onload事件?

慕妹3242003 2019-03-12 17:15:48
初學(xué)js,最近碰到一個比較困惑的問題,就是在頁面加載后執(zhí)行的命令是否都需要放進onload事件中?我用下面這種自執(zhí)行函數(shù)的形式,然后把js文件放到</body>標(biāo)簽的上面一行似乎也可以達成同樣的效果。(function() {    //要執(zhí)行的命令})();個人的理解是,onload事件是在頁面資源(包括圖片、css、Js等)完全加載后才發(fā)生的,那是否不涉及操作外部資源的情況下,完全可以用自執(zhí)行函數(shù)來代替onload事件?
查看完整描述

5 回答

?
蠱毒傳說

TA貢獻1895條經(jīng)驗 獲得超3個贊

這個應(yīng)該根據(jù)需求而定,完全替代肯定是不可能的。
如果你的需求是頁面載入后即執(zhí)行,那么按題主的方式寫個位于底部的自執(zhí)行函數(shù)自然可以達到效果。

但假設(shè)我的需求是對頁面中一個 IMG 元素的 height 和 width 屬性進行操作,你的自執(zhí)行函數(shù)就有可能失效了,因為你沒法判斷圖像是否已經(jīng)完全載入,而如果使用 onload 方法時,則表示頁面內(nèi)的資源都已經(jīng)載入,此時執(zhí)行內(nèi)部的代碼操作圖像元素的寬高一定是沒有問題的。

即使是 jQuery 封裝的 $(document).ready() 方法也不能說取代 onload 方法,簡單的立即執(zhí)行函數(shù)又怎么可能做到呢?:)


查看完整回答
反對 回復(fù) 2019-04-13
?
慕桂英3389331

TA貢獻2036條經(jīng)驗 獲得超8個贊

看了上面的答案,還是沒明白,題主需要弄清楚一個概念:

JS具有阻塞特性,當(dāng)瀏覽器在執(zhí)行js代碼時,不能同時做其它事情,即<script>每次出現(xiàn)都會讓頁面等待腳本的解析和執(zhí)行(不論JS是內(nèi)嵌的還是外鏈的),JS代碼執(zhí)行完成后,才繼續(xù)渲染頁面。
所有<script>應(yīng)該盡可能放到<body>的底部,以減少對頁面下載的影響。

找了下資料:

window.onload需要當(dāng)頁面全部加載完成,包括圖片、flash等富媒體;
DOMReady只需要判斷頁面內(nèi)所有的DOM節(jié)點是否已經(jīng)全部生成,至于節(jié)點中的內(nèi)容是否已經(jīng)加載完成,它并不關(guān)心。
因此DOMready觸發(fā)事件的響應(yīng)速度比window.onload更快,更迅速。

DOM Ready 調(diào)研結(jié)論

setTimeout設(shè)置的函數(shù), 會在readyState為complete時觸發(fā), 但是觸發(fā)時間點是在圖片資源加載完畢后.

readyState為interactive時, DOM結(jié)構(gòu)并沒有穩(wěn)定, 此時依然會有腳本修改DOM元素.
readyState為complete時, 圖片已經(jīng)加載完畢,
實驗中對圖片加載設(shè)置了延時.所以complete雖然在window.onload前執(zhí)行, 但是還是太晚.

外部script:如果將此script放在頁面上方, 則無法穩(wěn)定觸發(fā). 并且觸發(fā)時DOM結(jié)構(gòu)依然可能發(fā)生變化.
內(nèi)部script:與外部script同樣的問題, 觸發(fā)的時間過早.

doScroll: doScroll通過時readyState可能為interactive, 也可能為complete.
但是一定會在DOM結(jié)構(gòu)穩(wěn)定后, 圖片加載完畢前執(zhí)行.

所以可以看出, 目前的setTimeout方法, 外部script和內(nèi)部script方法,
都是存在錯誤的.應(yīng)該說這些方法不能安全可靠的實現(xiàn)DomReady事件.

而單純使用readyState屬性是無法判斷出Dom Ready事件的. interactive狀態(tài)過早(DOM沒有穩(wěn)定),
complete狀態(tài)過晚(圖片加載完畢).

jQuery實現(xiàn)中使用的doScroll方法是目前唯一可用的方法. window.onload 這時圖片flash等資源都加載完畢

當(dāng)瀏覽器從服務(wù)器接收到了HTML文檔,并把HTML在內(nèi)存中轉(zhuǎn)換成DOM樹,在轉(zhuǎn)換的過程中如果發(fā)現(xiàn)某個節(jié)點(node)上引用了CSS或者IMAGE,就會再發(fā)1個request去請求CSS或image,然后繼續(xù)執(zhí)行下面的轉(zhuǎn)換,而不需要等待request的返回,當(dāng)request返回后,只需要把返回的內(nèi)容放入到DOM樹中對應(yīng)的位置就OK。但當(dāng)引用了JS的時候,瀏覽器發(fā)送1個js request就會一直等待該request的返回。因為瀏覽器需要1個穩(wěn)定的DOM樹結(jié)構(gòu),而JS中很有可能有代碼直接改變了DOM樹結(jié)構(gòu),比如使用document.write 或 appendChild,甚至是直接使用的location.href進行跳轉(zhuǎn),瀏覽器為了防止出現(xiàn)JS修改DOM樹,需要重新構(gòu)建DOM樹的情況,所以就會阻塞其他的下載和呈現(xiàn).


查看完整回答
反對 回復(fù) 2019-04-13
?
GCT1015

TA貢獻1827條經(jīng)驗 獲得超4個贊

這倆概念完全就不是一回事兒。就好像雷峰塔和巴基斯坦,有啥關(guān)系呢?

自執(zhí)行函數(shù),免去了命名再執(zhí)行的繁瑣,反正用一次就不管了。
可是onload是事件啊,就好像是,我狠狠掐了你一下,你才會疼的哇哇叫。

那么,你覺得,我說的特定事件匿名函數(shù),有啥關(guān)系?


查看完整回答
反對 回復(fù) 2019-04-13
?
炎炎設(shè)計

TA貢獻1808條經(jīng)驗 獲得超4個贊

如果需要執(zhí)行的代碼不依賴于DOM的樣式之類的,當(dāng)然可以替代啦。

此外,還有一個DOM ready事件,不同瀏覽器實現(xiàn)不同,jQuery有一個封裝好的方法是

$(document).ready(fun)

三者的執(zhí)行先后:

【寫在</body>前】 先于 【DOM ready事件】 先于 【W(wǎng)indow onload事件】


查看完整回答
反對 回復(fù) 2019-04-13
  • 5 回答
  • 0 關(guān)注
  • 1257 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號