jQurey對象和DOM對象的相互轉換

今天在寫這段程序是出現錯誤

var $sibing=$("p").siblings();
alert($sibing.length);
for(var i=0;i<$sibing.length;i++){
 alert($sibing.get(i).html());
}

正確的應該是

var $sibing=$("p").siblings();

alert($sibing.length);
for(var i=0;i<$sibing.length;i++){
 alert($sibing.get(i).innerHTML);
}

因爲$sibing.get(i)時已經將jquery對象轉成了DOM對象。所以下面的纔是正確的，正好藉此機會記錄自己的錯誤經常看看引以爲戒。

如果一個獲取的是jQuery對象，那麼我們在變量前面加上$，如：

var  $variable  =   jQuery 對象 ;

如果獲取的是DOM對象，則這麼定義：

var  variable   =   DOM對象;

本書中的例子均會以這種方式呈現，以方便讀者閱讀。

 

l  jQuery對象轉成DOM對象

前面說了，jQuery對象不能使用DOM中的方法， 但如果你對jQuery對象所提供的方法不熟悉，或者jQuery沒有封裝你想要的方法，這時你不得不用一下DOM對象的時候，你該怎麼辦呢？

在這裏提供兩種方式來將一個jQuery對象轉換成DOM對象：

[ index ] 和 .get( index) ；

（1）jQuery對象是一個數組對象，可以通過 [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是否被選中了

 

l  DOM對象轉成jQuery對象

對於已經是一個DOM對象的，我們只需要用$( ) 把 DOM對象包裝起來，就可以獲得一個如假包換的jQuery對象了。比如：$( DOM對象) ;

var cr  = document.getElementById("cr");    //DOM對象

var $cr  = $(cr);                          // jQuery 對象

轉換後，就可以任意使用jQuery中的方法了。

通過以上提供的方法，我們可以任意的相互轉換 jQuery對象和DOM對象。最後再次強調下，DOM對象才能使用DOM中的方法，jQuery對象是不可以用DOM中的方法的，但jQuery對象提供了一套更加完善的工具用於操作DOM