jQuery 對(duì)象是通過(guò) jQuery 包裝DOM 對(duì)象后產(chǎn)生的對(duì)象。jQuery 對(duì)象是 jQuery 獨(dú)有的，其可以使用 jQuery 里的方法，但是不能使用 DOM 的方法；例如： $("#img").attr("src","test.jpg"); 這里的 $("#img")就是 jQuery 對(duì)象。

DOM對(duì)象就是Javascript 固有的一些對(duì)象操作。DOM 對(duì)象能使用Javascript 固有的方法，但是不能使用 jQuery 里的方法。例如：document.getElementById("img").src = “test.jpg"；這里的document.getElementById("img") 就是DOM 對(duì)象。

$("#img").attr("src","test.jpg"); 和 document.getElementById("img").src = "test.jpg"; 是等價(jià)的，是正確的，但是 $("#img").src = "test.jpg" ；或者 document.getElementById("img").attr("src","test.jpg"); 都是錯(cuò)誤的。

再說(shuō)一個(gè)例子，就是this, 在寫(xiě) jQuery 時(shí)經(jīng)常這樣寫(xiě)： this.attr("src","test.jpg")；可是就是出錯(cuò)，其實(shí)this 是DOM對(duì)象，而.attr("src","test.jpg") 是 jQuery 方法，所以出錯(cuò)了。要解決這個(gè)問(wèn)題就要將 DOM對(duì)象轉(zhuǎn)換成 jQuery 對(duì)象，例如 $(this).attr("src","test.jpg");

1. DOM 對(duì)象轉(zhuǎn)成 jQuery 對(duì)象

對(duì)于已經(jīng)是一個(gè) DOM 對(duì)象，只需要用 $() 把DOM對(duì)象包裝起來(lái)，就可以獲得一個(gè) jQuery 對(duì)象了，$(DOM 對(duì)象) 注： var是定義變量

如：　

var v = document.getElementById("v"); //DOM對(duì)象
var $v = $(v); //jQuery 對(duì)象

轉(zhuǎn)換后，就可以任意使用 jQuery 的方法。

2. jQuery 對(duì)象轉(zhuǎn)成 DOM 對(duì)象

兩種轉(zhuǎn)換方式講一個(gè) jQuery 對(duì)象轉(zhuǎn)換成 DOM 對(duì)象： [index] 和 .get(index)；

(1) jQuery 對(duì)象是一個(gè)數(shù)據(jù)對(duì)象，可以通過(guò) [index] 的方法，來(lái)得到相應(yīng)的 DOM 對(duì)象。

如：

var $v = $("#v"); //jQuery 對(duì)象
var v = $v[0]; //DOM 對(duì)象
alert(v.checked); //檢測(cè)這個(gè)checkbox是否被選中

(2) jQuery 本身提供，通過(guò).get(index) 方法得到相應(yīng)的 DOM 對(duì)象

如：

var $v = $("#v"); //jQuery 對(duì)象
var v = $v.get(0); //DOM對(duì)象 ( $v.get()[0] 也可以 )
alert(v.checked); //檢測(cè)這個(gè) checkbox 是否被選中

通過(guò)以上方法，可以任意的相互轉(zhuǎn)換 jQuery 對(duì)象和 DOM 對(duì)象，需要再?gòu)?qiáng)調(diào)的是： DOM 對(duì)象才能使用DOM 中的方法，jQuery 對(duì)象是不可以使用DOM中的方法。

最新評(píng)論