摘要:好久沒寫文章了,再來一波,首先上圖參考鏈接與的區別詳見瀏覽器工作原理瀏覽器工作原理前言頁面加載完成有兩種事件一是,表示文檔結構結構已經加載完成不包含圖片等非文字媒體文件,二是,指示頁面包含圖片等文件在內的所有元素都加載完成。
好久沒寫文章了,再來一波,首先上圖:
參考鏈接:onload與ready的區別
詳見瀏覽器工作原理:瀏覽器工作原理
頁面加載完成有兩種事件:
一是ready,表示文檔結構(DOM結構)已經加載完成(不包含圖片等非文字媒體文件),
二是onload,指示頁面包含圖片等文件在內的所有元素都加載完成。(可以說:ready 在onload 前加載!!!)
我的理解: 一般樣式控制的,比如圖片大小控制放在onload 里面加載;而:jS事件觸發的方法,可以在ready 里面加載;
$(function(){ // do something }); 其實這個就是jq ready()的簡寫,他等價于: $(document).ready(function(){ //do something }) //或者下面這個方法,jQuer的默認參數是:“document”; $().ready(function(){ //do something })body的onload事件與$(document).ready相比 加載多函數問題
原生javascript中函數沒有重載,所以會實現覆蓋
a)body中聲明的onload事件(DOM0級別)會被后面的window.onlad()(DOM0級別)覆蓋
b)只能在body中的onload中實現多函數執行
function a(){alert("a");} function b(){alert("b");}
c)多個window.load()會覆蓋(如a)實例)
window.onload = function(){alert("hello");} window.onload = function(){alert("world");}
在JQuery中你可以利用多個JQuery.Ready()方法,它們會按次序依次執行
代碼和內容分離問題body中的onload不分離
而window.onload()分離以及$(document),ready()可以分離
$(document).ready():在DOM結構加載完畢之后執行
window.onload:在所有的文件加載完畢之后執行
$(document).ready():最大的區別是DOM加載完畢之后,不必再去等圖片(異步)加載完畢后執行js代碼
window.onload用法$(window).load()
使用$(window).load()方法,這 個方法會等到頁面所有內容加載完畢后才會觸發,并且同時又沒有OnLoad事件的弊端.
以下內容會在頁面所有內容加載完成后按先后順序依次執行.
與之對應的unload事件(會在頁面關閉時候執行)
$(window).unload(function() { alert("good bye"); });
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/82333.html
摘要:和的區別文檔加載完成事件頁面加載完成有兩種事件一是,表示文檔結構已經加載完成不包含圖片等非文字媒體文件二是,指示頁面包含圖片等文件在內的所有元素都加載完成。即當所有鏈接被鼠標單擊的時候,都執行也就是說頁面加載時綁定,真正該觸發時觸發。 document.ready和onload的區別——JavaScript文檔加載完成事件頁面加載完成有兩種事件: 一是ready,表示文檔結構已經加載完...
摘要:如果你的文件涉及操作,可以直接在里面添加回調函數,或者說基本上我們的文件都可以寫在里面進行調用其實,這和我們將文件放在底部,在上面加以及異步加載文件的效果是一樣一樣的。 如果大家想繼續看下面的內容的話,有一個要求,就是回答我一個問題:你這樣寫過代碼嗎? window.onload = function(){ $(.gravatar).on(click,function(){ ...
摘要:的速度明顯快于重排重繪與的區別理解了瀏覽器是如何渲染頁面之后我們再來比較這兩者就很好理解了執行的時間必須等到頁面內包括圖片的所有元素加載完畢后才能執行。 先上圖,我們再慢慢解釋,這圖就是瀏覽器加載網頁的一個過程 showImg(https://segmentfault.com/img/remote/1460000008648335?w=516&h=425); 當我們在瀏覽器輸入一個地址...
摘要:的速度明顯快于重排重繪與的區別理解了瀏覽器是如何渲染頁面之后我們再來比較這兩者就很好理解了執行的時間必須等到頁面內包括圖片的所有元素加載完畢后才能執行。 先上圖,我們再慢慢解釋,這圖就是瀏覽器加載網頁的一個過程 showImg(https://segmentfault.com/img/remote/1460000008648335?w=516&h=425); 當我們在瀏覽器輸入一個地址...
閱讀 695·2021-11-15 11:37
閱讀 3316·2021-10-27 14:14
閱讀 6038·2021-09-13 10:30
閱讀 2961·2021-09-04 16:48
閱讀 1926·2021-08-18 10:22
閱讀 2125·2019-08-30 14:19
閱讀 728·2019-08-30 10:54
閱讀 1745·2019-08-29 18:40