初學(xué)jQuery,會對jQuery對象和DOM對象心存很大的疑惑,因此有必要明白他們之間的區(qū)別和聯(lián)系。DOM對象是我們用傳統(tǒng)的方法(javascript)獲得的對象,jQuery對象就是用jQuery的類庫選擇器獲得的對象。JQuery對象就...
初學(xué)jQuery,會對jQuery對象和DOM對象心存很大的疑惑,因此有必要明白他們之間的區(qū)別和聯(lián)系。
DOM對象是我們用傳統(tǒng)的方法(javascript)獲得的對象,jQuery對象就是用jQuery的類庫選擇器獲得的對象。JQuery對象就是通過jQuery包裝DOM對象后產(chǎn)生的對象。JQuery對象是jQuery獨(dú)有的,其可以使用jQuery里的方法,但是不能使用DOM的方法;
例如:
$("#color").html();//獲取id為color的元素內(nèi)的html代碼,html()是jQuery特有的方法;
它等同于:
document.getElementById("color").innerHTML;
DOM對象就是javascript固有的一些對象。DOM對象能使用javascript固有的方法,但是不能使用jQuery里面的方法。
例如$("#id").innerHTML 和$("#id").checked之類的寫法都是錯誤的,可以用$("#id").html()和$("#id").attr("checked")之類的 jQuery方法來代替。
var domObj =document.getElementById("id"); //DOM對象
var $obj =$("#id"); //jQuery對象;
jQuery對象和DOM對象的相互轉(zhuǎn)換
jQuery對象轉(zhuǎn)換成DOM對象
jquery提供了兩種方法將一個jquery對象轉(zhuǎn)換成一個dom對象,即[index]和get(index)??赡苡腥藭X得奇怪,怎么是用下標(biāo)呢,沒錯,jquery對象就是一個數(shù)組對象.
下面代碼將演示一個jquery對象轉(zhuǎn)換成dom對象,再使用dom對象的方法
代碼如下:
var$cr=$("#cr"); //jquery對象
var cr = $cr[0]; //dom對象 也可寫成 var cr=$cr.get(0);
alert(cr.checked); //檢測這個checkbox是否給選中
dom對象轉(zhuǎn)換成jquery對象
對于一個dom對象,只需要用$()把dom對象包裝起來,就可以獲得一個jquery對象了,方法為$(dom對象);
復(fù)制代碼 代碼如下:
varcr=document.getElementById("cr"); //dom對象
var $cr = $(cr); //轉(zhuǎn)換成jquery對象
轉(zhuǎn)換后可以任意使用jquery中的方法了.