前端筆試小結(jié)之$(document).ready() vs window.onload()

MASAILA 發(fā)布于2019-08-19 18:09 / 618人閱讀

摘要：之前項(xiàng)目中總是使用，由于在方法內(nèi)注冊(cè)的事件，只要就緒就會(huì)被執(zhí)行，因此可能此時(shí)元素的關(guān)聯(lián)文件未下載完，則設(shè)置的屬性可能無(wú)效。結(jié)果筆試那天自己還記反寫(xiě)錯(cuò)了。通?？梢院?jiǎn)寫(xiě)為，等價(jià)于

Q： $(document).ready(){} vs window.onload()

之前項(xiàng)目中總是使用$(document).ready()，由于在$(document).ready()方法內(nèi)注冊(cè)的事件，只要DOM就緒就會(huì)被執(zhí)行，因此可能此時(shí)元素的關(guān)聯(lián)文件未下載完，則設(shè)置的屬性可能無(wú)效。
結(jié)果筆試那天自己還記反寫(xiě)錯(cuò)了。還是因?yàn)樽约簺](méi)有理解。

$(document).ready()是在DOM樹(shù)構(gòu)建好后就執(zhí)行，
window.onload()則是等待頁(yè)面所有元素都加載完成后才執(zhí)行。

$(document).ready()可以有多個(gè)，每次調(diào)用$(document).ready()方法都會(huì)在現(xiàn)有的行為上追加新的行為，這些行為函數(shù)會(huì)根據(jù)注冊(cè)的順序依次執(zhí)行，
window.onload()只能執(zhí)行一個(gè)，后面的函數(shù)會(huì)覆蓋前面的函數(shù)。

$(document).ready(function(){})通?？梢院?jiǎn)寫(xiě)為$(function(){})，
$(window).load(function(){})等價(jià)于window.onload()

云服務(wù)器 GPU云服務(wù)器 web前端筆試前端基礎(chǔ)js筆試 web前端工程師筆試 ready

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/79257.html

相關(guān)文章

前端Tank技能---頁(yè)面load事件分析

摘要：事件詳細(xì)研究邊界事件外鏈樣式在某些瀏覽器下面會(huì)影響腳本的加載。事件和事件是同時(shí)的。這就是要監(jiān)聽(tīng)頁(yè)面的事件，當(dāng)事件為時(shí)就可以開(kāi)始做的事情了。頁(yè)面加載狀態(tài) $(document).ready() $(function(){}) 這兩個(gè)是我們?cè)陧?yè)面初始化時(shí)經(jīng)常使用的監(jiān)聽(tīng)方案，那么他的實(shí)際的執(zhí)行關(guān)系時(shí)什么樣的呢？在原生js中是什么樣的一種表現(xiàn)？以下我會(huì)一而再再而三的寫(xiě)DOMConten...

silencezwm 2019-08-22 11:02 評(píng)論0 收藏0
前端Tank技能---頁(yè)面load事件分析

摘要：事件詳細(xì)研究邊界事件外鏈樣式在某些瀏覽器下面會(huì)影響腳本的加載。事件和事件是同時(shí)的。這就是要監(jiān)聽(tīng)頁(yè)面的事件，當(dāng)事件為時(shí)就可以開(kāi)始做的事情了。頁(yè)面加載狀態(tài) $(document).ready() $(function(){}) 這兩個(gè)是我們?cè)陧?yè)面初始化時(shí)經(jīng)常使用的監(jiān)聽(tīng)方案，那么他的實(shí)際的執(zhí)行關(guān)系時(shí)什么樣的呢？在原生js中是什么樣的一種表現(xiàn)？以下我會(huì)一而再再而三的寫(xiě)DOMConten...

lpjustdoit 2019-08-01 15:33 評(píng)論0 收藏0
常見(jiàn)js筆試面試題（持續(xù)更新）

摘要：相當(dāng)于繞過(guò)了瀏覽器端，自然就不存在跨域問(wèn)題。三者的區(qū)別與服務(wù)器的交互數(shù)據(jù)始終在同源的請(qǐng)求中攜帶即使不需要，即在瀏覽器和服務(wù)器間來(lái)回傳遞。而和不會(huì)自動(dòng)把數(shù)據(jù)發(fā)給服務(wù)器，僅在本地保存。和雖然也有存儲(chǔ)大小的限制，但比大得多，可以達(dá)到或更大。本文提供最簡(jiǎn)便的解答方式，方便快速記憶，復(fù)盤(pán)，詳細(xì)答案可自己再搜一下。 js基礎(chǔ)知識(shí) 1. javascript typeof返會(huì)的數(shù)據(jù)類(lèi)型有哪些 ob...

yuxue 2019-08-21 17:28 評(píng)論0 收藏0
前端知識(shí)普及之頁(yè)面加載

摘要：如果你的文件涉及操作，可以直接在里面添加回調(diào)函數(shù)，或者說(shuō)基本上我們的文件都可以寫(xiě)在里面進(jìn)行調(diào)用其實(shí)，這和我們將文件放在底部，在上面加以及異步加載文件的效果是一樣一樣的。如果大家想繼續(xù)看下面的內(nèi)容的話，有一個(gè)要求，就是回答我一個(gè)問(wèn)題:你這樣寫(xiě)過(guò)代碼嗎？ window.onload = function(){ $(.gravatar).on(click,function(){ ...

tianyu 2019-08-19 17:38 評(píng)論0 收藏0
onload事件與ready的區(qū)別

摘要：好久沒(méi)寫(xiě)文章了，再來(lái)一波，首先上圖參考鏈接與的區(qū)別詳見(jiàn)瀏覽器工作原理瀏覽器工作原理前言頁(yè)面加載完成有兩種事件一是，表示文檔結(jié)構(gòu)結(jié)構(gòu)已經(jīng)加載完成不包含圖片等非文字媒體文件，二是，指示頁(yè)面包含圖片等文件在內(nèi)的所有元素都加載完成。好久沒(méi)寫(xiě)文章了，再來(lái)一波，首先上圖： showImg(https://segmentfault.com/img/bVLD32?w=1105&h=244); 參考...

mating 2019-08-20 15:33 評(píng)論0 收藏0