JQuery onload、ready概念介紹及使用方法

頁面加載完成有兩種事件，一是ready，表示文檔結構已經加載完成（不包含圖片等非文字媒體文件），二是onload，指示頁

創(chuàng)新互聯(lián)專注于濰坊企業(yè)網站建設,成都響應式網站建設公司,電子商務商城網站建設。濰坊網站建設公司,為濰坊等地區(qū)提供建站服務。全流程按需求定制開發(fā)，專業(yè)設計，全程項目跟蹤，創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務

面包含圖片等文件在內的所有元素都加載完成。(可以說：ready

在onload

前加載！！！)

一般樣式控制的，比如圖片大小控制放在onload

里面加載;

jS事件觸發(fā)的方法，可以在ready

里面加載;

用jQ的人很多人都是這么開始寫腳本的：

通常的寫法

復制代碼

代碼如下:

$(function(){

//

do

something

});

其實這個就是jq

ready()的簡寫，他等價于：

復制代碼

代碼如下:

$(document).ready(function(){

//do

something

})

也等于下面這個方法，jQuer的默認參數(shù)是：“document”；

復制代碼

代碼如下:

$().ready(function(){

//do

something

})

$(document).Ready()方法

VS

OnLoad事件

VS

$(window).load()方法

接觸JQuery一般最先學到的是何時啟動事件。在曾經很長一段時間里,在頁面載入后引發(fā)的事件都被加載

在”Body”的Onload事件里.

對于Body的Onload事件和JQuery的Ready方法相比，有很多弊端.比如:

加載

多個函數(shù)的問題

■body

onload="a();b();"

/body

在Onload事件中

只能這樣加載，很丑陋…

■而在JQuery中你可以利用多個JQuery.Ready()方法，它們會按次序依次執(zhí)行

代碼和內容不分離

這個貌似不用說了，讓人深惡痛絕-.-!!?

執(zhí)行先后順序不同

■對于Body.Onload事件，是在加載完所有頁面內容才會觸發(fā)，我的意思是所有內容,包括圖片，flash等.如果頁面的這些內容很多會讓用戶等待很

長時間.

■

而對于$(document).ready()方法，這個方法只是在頁面所有的DOM加載完畢后就會觸發(fā),無疑很大的加快了網頁的速度.

但是對于一些特殊應用，比如圖片的放大縮小，圖片的剪裁。需要網頁所有的內容加載完畢后才執(zhí)行的呢？我推薦使用$(window).load()方法，這

個方法會等到頁面所有內容加載完畢后才會觸發(fā)，并且同時又沒有OnLoad事件的弊端.

復制代碼

代碼如下:

script

type="text/javascript"

$(window).load(function()

{

alert("hello");

});

$(window).load(function()

{

alert("hello

again");

});

/script

上面的代碼會在頁面所有內容加載完成后按先后順序依次執(zhí)行.

當然不要忘了與之對應的Unload方法

復制代碼

代碼如下:

script

type="text/javascript"

$(window).unload(function()

{

alert("good

bye");

});

/script

上面代碼會在頁面關閉時引發(fā).

在

所有DOM加載之前引發(fā)JS代碼

這個方法是我在調試的時候最喜歡的，有時候開發(fā)的時候也用這種方法

復制代碼

代碼如下:

body

script

type="text/javascript"

(function()

{

alert("hi");

})(jQuery)

/script

/body

對，

就是利用js閉包的形式將js代碼嵌入body，這段代碼會自動執(zhí)行，當然也可以直接嵌入js代碼,這種方式要注意順序問題，如下：

復制代碼

代碼如下:

body

div

id="test"this

is

the

content/div

script

type="text/javascript"

alert($("#test").html());//I

Can

display

the

content

/script

/body

body

script

type="text/javascript"

alert($("#test").html());//I

Can't

display

the

content

/script

div

id="test"this

is

the

content/div

/body

上面兩段代碼,

第二段代碼當中因為只能解釋到當前代碼之前的DOM,而test并不存在于已經解析的DOM數(shù).所以第二段代碼無法正確顯示.

jQuery中document的ready和load事件的區(qū)別

ready事件在DOM結構繪制完成之后就繪執(zhí)行。這樣能確保就算有大量的媒體文件沒加載出來，JS代碼一樣可以執(zhí)行。

load事件必須等到網頁中所有內容全部加載完畢之后才被執(zhí)行。如果一個網頁中有大量的圖片的話，則就會出現(xiàn)這種情況：網頁文檔已經呈現(xiàn)出來，但由于網頁數(shù)據(jù)還沒有完全加載完畢，導致load事件不能夠即時被觸發(fā)。

其實如果頁面中要是沒有圖片之類的媒體文件的話ready與load是差不多的，但是頁面中有文件就不一樣了，所以還是推薦在工作中用ready。

jquery ready和onload的區(qū)別

1、window.onload必須等到頁面內包括多媒體等所有元素加載完畢后才能執(zhí)行，

$(document).ready()是DOM結構繪制完畢后就執(zhí)行，不必等到多媒體加載完畢，ready()快于onload；

2、window.onload不能同時編寫多個，如果有多個window.onload方法，只會執(zhí)行一個

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

jquery什么時候需要用$()ready 必須寫么

你好，$().ready作用于所有html的dom元素加載完畢之后，尤其是動態(tài)的html，在不確定html文檔是否加載完成的情況下，需要使用，如果不使用，可能會出現(xiàn)，dom元素未加載完成，如果直接使用$("div")防止獲取的dom為null，所以建議必須寫上

其二，建議jquery的代碼寫在$().ready中，這是一個jquery的環(huán)境，也就是說在他中的代碼可以被jquery識別，為了防止jquery庫出現(xiàn)錯誤

希望可以幫助到你

jQuery中ready和load的區(qū)別

ready是文檔準備完成，load是文檔載入完成。簡單點說就是ready在load之前響應。

當前名稱：jquery的ready,jQuery用法
文章路徑：http://www.yijiale78.com/article10/dsccjdo.html

成都網站建設公司_創(chuàng)新互聯(lián)，為您提供虛擬主機、網站收錄、定制網站、網站策劃、云服務器、品牌網站設計

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)