jQurey对象和DOM对象的相互转换

来源:互联网 发布:ip网络加速器免费版 编辑:程序博客网 时间:2024/05/21 00:48

今天在写这段程序是出现错误

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对象;

本书中的例子均会以这种方式呈现,以方便读者阅读。

 

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是否被选中了

 

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