對于jQuery的初學者來說，經(jīng)常分辨不清DOM對象和jQuery對象，本文簡單說明兩者的區(qū)別和兩種對象相互轉換的方法。如你已掌握可以略過，如文中有錯誤之處請您指正。
DOM對象
DOM對象對有HTML基礎的人來說，并不陌生：DOM（Document Object Model）即文檔對象模型，每一份DOM都可以表示成一棵樹，如下基本網(wǎng)頁：
可以將上面HTML結構描述為一顆DOM樹：
? ? ? ? ? ? ? ? ? ? ?head——meta、title
HTML——
? ? ? ? ? ? ? ? ? ? body——h1、p、ul(li、li、li)
在這顆DOM樹中，<h1>、<p>、<ul>和<ul>的三個<li>子節(jié)點都是DOM元素節(jié)點?？梢酝ㄟ^JavaScript中的 getElementByTagName 或者 getElementById 來獲取元素節(jié)點。像這樣得到的DOM元素就是DOM對象。DOM對象可以用JavaScript中的方法：
var domObj = document.getElementById("id"); ?//獲得DOM對象
var ObjHTML = domObj.innerHTML; ?//使用JavaScript中的方法——innerHTML
jQuery對象
jQuery對象就是通過jQuery包裝DOM對象后產(chǎn)生的對象。
jQuery對象是jQuery獨有的。如果一個對象是jQuery對象，那么就可以使用jQuery里的方法，例如：
$("#foo").html(); ?//獲取id為foo的元素內(nèi)的html代碼
這段代碼等同于：
document.getElementById("foo").innerHTML;
在jQuery對象中無法使用DOM對象的任何方法。如 $("#id").innerHTML 和$("#id").checked 之類的寫法都是錯誤的，可以使用 $("#id").html() 和 $("#id").attr("checked") 之類的jQuery方法代替。同樣，DOM對象也不能使用jQuery里的方法。例如：document.getElementById("id").html()也會報錯，只能用 document.getElementById("id").innerHTML語句。
用 #id 作為選擇符取得的是jQuery對象而并非document.getElementById("id")所得到的DOM對象，兩者并不等價。
DOM對象轉換為jQuery對象
對于一個DOM對象，只需要用 $() 把DOM對象包裝起來，就可以獲得一個jQuery對象了，方式為 $("DOM對象")。jQuery代碼如下：
var cr = document.getElementById("cr"); ?//DOM對象
var $cr = $(cr); //jQuery對象
轉換后，可以任意使用jQuery中的方法。
jQuery對象轉換為DOM對象
jQuery對象轉換為DOM對象，一般有以下兩種方法：
（1）jQuery對象是一個數(shù)組對象，可以通過 [index] 的方法得到相應的DOM對象：
var $cr = $("#cr"); ?//jQuery對象
var cr = $cr[0]; ?//DOM對象
alert(cr.checked); ?//檢測這個checkbox是否被選中
（2）另一種是jQuery本身提供的，通過 get(index) 方法得到相應的DOM對象：
var $cr = $("#cr"); ?//jQuery對象
var cr = $cr.get(0); //DOM對象
alert(cr.checked);//檢測這個checkbox是否被選中
關于對象變量的命名建議
約定好代碼的編寫的風格，對自己的編程速度和日后理解還有團隊的配合都有很好的作用，這里就簡單介紹對象變量的命名建議，如有更好的方法，請交流學習。
一個簡單的方法，如果獲取的對象是jQuery對象，那么變量前加上$:
var $variable = jQuery對象；
如果獲取的對象是DOM對象，則定義如下：
var variable = DOM對象；
