之前雖然好多地方用到了jQuery，但是并沒(méi)有系統(tǒng)的學(xué)過(guò)，所以近期想認(rèn)真的學(xué)一下。

首先簡(jiǎn)單說(shuō)一下DOM對(duì)象和jQuery對(duì)象：

DOM對(duì)象

DOM對(duì)象其實(shí)就是DOM樹中的元素節(jié)點(diǎn)，比如說(shuō)使用getElementById獲取的元素節(jié)點(diǎn)就是一個(gè)DOM對(duì)象：

 var domObj = document.getElementById("id");

jQuery對(duì)象

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

 var domObj = $("#id");

但是他兩是完全不同的，舉個(gè)栗子吧，下面是一個(gè)輸入框，給它一個(gè)id，

 <input type="text" id="input" value="heihei"/>

那么我分別用DOM和jQuery獲取它：

var jqObj = $("#input");
var domObj = document.getElementById("input");
console.log(jqObj);
console.log(domObj);

很顯然，他兩完全不同，那么接下來(lái)就來(lái)看看怎么讓他兩相互轉(zhuǎn)換呢

jQuery對(duì)象轉(zhuǎn)換為DOM對(duì)象

• [index]
  jQuery對(duì)象是一個(gè)類似數(shù)組的對(duì)象，所以可以使用[index]的方法得到相應(yīng)的DOM對(duì)象，代碼如下：

var jqObj = $("#input");     //jQuery對(duì)象
var domObj = jqObj[0];      //DOM對(duì)象

• get(index)
  這種方法是jQuery本身提供的，通過(guò)get(index)方法得到相應(yīng)的DOM對(duì)象，代碼如下：

var jqObj = $("#input");     // jQuery對(duì)象
var domObj = jqObj.get(0);     //DOM對(duì)象

DOM對(duì)象轉(zhuǎn)換為jQuery對(duì)象

對(duì)于一個(gè)DOM對(duì)象，只需要用$()把DOM對(duì)象包裝起來(lái)，就可以獲得一個(gè)jQuery對(duì)象，代碼如下：

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