這篇文章主要介紹jquery對(duì)象與dom對(duì)象的區(qū)別是什么，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

創(chuàng)新互聯(lián)建站專(zhuān)注于企業(yè)成都營(yíng)銷(xiāo)網(wǎng)站建設(shè)、網(wǎng)站重做改版、大邑縣網(wǎng)站定制設(shè)計(jì)、自適應(yīng)品牌網(wǎng)站建設(shè)、H5網(wǎng)站設(shè)計(jì)、商城網(wǎng)站建設(shè)、集團(tuán)公司官網(wǎng)建設(shè)、成都外貿(mào)網(wǎng)站制作、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)等建站業(yè)務(wù)，價(jià)格優(yōu)惠性?xún)r(jià)比高，為大邑縣等各大城市提供網(wǎng)站開(kāi)發(fā)制作服務(wù)。

區(qū)別：jQuery對(duì)象是使用jQuery類(lèi)庫(kù)的選擇器獲得的對(duì)象，它是jQuery獨(dú)有的，可以使用jQuery里的方法，但無(wú)法使用DOM對(duì)象的任何方法；DOM對(duì)象是使用javascript方法獲得的對(duì)象，DOM對(duì)象不能使用jQuery方法。

一、Dom對(duì)象、jQuery對(duì)象

1.1 Dom對(duì)象

文檔對(duì)象模型簡(jiǎn)稱(chēng)DOM，是W3C組織推薦的處理可擴(kuò)展置標(biāo)語(yǔ)言的標(biāo)準(zhǔn)編程接口。

• DOM實(shí)際上是以面向?qū)ο蠓绞矫枋龅奈臋n模型。DOM定義了表示和修改文檔所需的對(duì)象、這些對(duì)象的行為和屬性以及這些對(duì)象之間的關(guān)系。

• 通過(guò)DOM，可以訪問(wèn)所有的 HTML 元素，連同它們所包含的文本和屬性?？梢詫?duì)其中的內(nèi)容進(jìn)行修改和刪除，同時(shí)也可以創(chuàng)建新的元素。

• DOM 獨(dú)立于平臺(tái)和編程語(yǔ)言。它可被任何編程語(yǔ)言諸如 Java、JavaScript 和 VBScript 使用。

• DOM對(duì)象，即是我們用傳統(tǒng)的方法(javascript)獲得的對(duì)象。

• DOM準(zhǔn)確說(shuō)是對(duì)文檔對(duì)象的一種規(guī)范標(biāo)準(zhǔn)(文檔對(duì)象模型),標(biāo)準(zhǔn)只定義了屬性和方法行為。

1.2 jQuery對(duì)象

1）概述

jQuery對(duì)象其實(shí)是一個(gè)JavaScript的數(shù)組,這個(gè)數(shù)組對(duì)象包含125個(gè)方法和4個(gè)屬性

4個(gè)屬性分別是：

• jquery 當(dāng)前的jquery框架版本號(hào)

• length 指示該數(shù)組對(duì)象的元素個(gè)數(shù) .

• context 一般情況下都是指向HtmlDocument對(duì)象 .

• selector 傳遞進(jìn)來(lái)的選擇器內(nèi)容

jquery對(duì)象就是通過(guò)jQuery包裝DOM對(duì)象后產(chǎn)生的對(duì)象。jQuery對(duì)象是jQuery獨(dú)有的，其可以使用jQuery里的方法，但是不能使用DOM的方法；反過(guò)來(lái)Dom對(duì)象也不能使用jquery的方法。

2）jQuery對(duì)象和js對(duì)象區(qū)別

• jQuery對(duì)象屬于js的數(shù)組

• jQuery對(duì)象是通過(guò)jQuery包裝的DOM對(duì)象后產(chǎn)生的

• jQuery對(duì)象不能使用DOM對(duì)象的方法和屬性

• DOM對(duì)象不能使用jQuery對(duì)象的方法和屬性

3）jQuery對(duì)象和js對(duì)象之間的相互轉(zhuǎn)換

• js轉(zhuǎn)jQuery對(duì)象$(js對(duì)象)

• jQuery對(duì)象轉(zhuǎn)js對(duì)象

var doc2=$("#idDoc2")[0];   //轉(zhuǎn)換jQuery對(duì)象為DOM對(duì)象  
doc2.innerHTML="這是jQuery的第一個(gè)DOM對(duì)象"  
  //使用jQuery對(duì)象本身提供的get函數(shù)來(lái)返回指定集合位置的DOM對(duì)象  
var doc2=$("#idDoc2").get(0);  
doc2.innerHTML="這是jQuery的第二個(gè)DOM對(duì)象"

二、細(xì)說(shuō)jQuery對(duì)象和DOM對(duì)象的區(qū)別與使用

2.1 jQuery對(duì)象和DOM對(duì)象

DOM對(duì)象，即是我們用傳統(tǒng)的方法(javascript)獲得的對(duì)象，jQuery對(duì)象即是用jQuery類(lèi)庫(kù)的選擇器獲得的對(duì)象。

var domObj = document.getElementById("id"); //DOM對(duì)象
var $obj = $("#id"); //jQuery對(duì)象;

jQuery對(duì)象就是通過(guò)jQuery包裝DOM對(duì)象后產(chǎn)生的對(duì)象，它是jQuery獨(dú)有的。如果一個(gè)對(duì)象是jQuery對(duì)象，那么就可以使用jQuery里的方法。

$("#foo").html(); //獲取id為foo的元素內(nèi)的html代碼，html()是jQuery特有的方法

等同于js中：

document.getElementById("foo").innerHTML;

注意：在jQuery對(duì)象中無(wú)法使用DOM對(duì)象的任何方法。

例如:

$("#id").innerHTML 和$("#id").checked之類(lèi)的寫(xiě)法都是錯(cuò)誤的

可以用

$("#id").html()和$("#id").attr ("checked")之類(lèi)的 jQuery方法來(lái)代替。

同樣，DOM對(duì)象也不能使用jQuery方法。學(xué)習(xí)jQuery開(kāi)始就應(yīng)當(dāng)樹(shù)立正確的觀念，分清jQuery對(duì)象和DOM對(duì)象之間的區(qū)別，之后學(xué)習(xí) jQuery就會(huì)輕松很多的。

2.2 jQuery對(duì)象和DOM對(duì)象的互相轉(zhuǎn)換

2.2.1 jquery對(duì)象轉(zhuǎn)換成dom對(duì)象

jquery提供了兩種方法將一個(gè)jquery對(duì)象轉(zhuǎn)換成一個(gè)dom對(duì)象，即[index]和get(index)。
可能有人會(huì)覺(jué)得奇怪，怎么是用下標(biāo)呢，沒(méi)錯(cuò)，jquery對(duì)象就是一個(gè)數(shù)組對(duì)象。
舉例：

var $cr=$("#cr"); //jquery對(duì)象
var cr = $cr[0]; //dom對(duì)象 也可寫(xiě)成 var cr=$cr.get(0);
alert(cr.checked); //檢測(cè)這個(gè)checkbox是否給選中

2.2.2 dom對(duì)象轉(zhuǎn)換成jquery對(duì)象

對(duì)于一個(gè)dom對(duì)象，只需要用$()把dom對(duì)象包裝起來(lái)，就可以獲得一個(gè)jquery對(duì)象了，
方法為$(dom對(duì)象);
舉例：

var cr=document.getElementById("cr"); //dom對(duì)象
var $cr = $(cr); //轉(zhuǎn)換成jquery對(duì)象

轉(zhuǎn)換后可以任意使用jquery中的方法了。

三、總結(jié)一下

dom對(duì)象才能使用dom中的方法，jquery對(duì)象不可以使用dom中的方法，但 jquery對(duì)象提供了一套更加完善的工具用于操作dom。

平時(shí)用到的jquery對(duì)象都是通過(guò)$()函數(shù)制造出來(lái)的，$()函數(shù)就是一個(gè)jquery對(duì)象的制造工廠。

注意：

如果獲取的對(duì)象是 jquery對(duì)象，那么在變量前面加上$,這樣方便容易識(shí)別出哪些是jquery對(duì)象。

舉例：

var $variable = jquery對(duì)象;

如果獲取的是dom對(duì)象，則定義如下:

var variable = dom對(duì)象

以上是“jquery對(duì)象與dom對(duì)象的區(qū)別是什么”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

當(dāng)前文章：jquery對(duì)象與dom對(duì)象的區(qū)別是什么
文章來(lái)源：http://aaarwkj.com/article24/jeggje.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供微信公眾號(hào)、軟件開(kāi)發(fā)、搜索引擎優(yōu)化、ChatGPT、網(wǎng)站排名、商城網(wǎng)站

廣告

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