jQuery object 和 DOM element 之间的关系
在使用jQuery时,发现有两种对象,一个是[object Object],另一个是就像[object HTMLDivElement]
前者是jQuery对象,通过jQuery的选择器$('selector')获得;后者是DOM元素,为 javascript中的getElementById, getElementsByTagName等方法的返回类型。
只有jQuery对象才能使用jQuery的一系列方法,DOM元素是不能用的。
其实,jQuery对象就类似一个数组,它包含了一个或多个与jQuery选择器匹配的DOM元素。
//一个js获取的标签为li的元素数组 var normalArray = document.getElementsByTagName('li'); //相当于上面的,但是是一个jQuery对象 var jQueryArray = $('li'); //如果是由元素Id获得DOM元素的话,则jQuery对象就像一个长度为1的数组。 //比如,以下三个alert的结果是相同的 alert(document.getElementById('myID')); alert($('#myID')[0]); alert($('#myID').get(0)); //*** jQuery对象与DOM元素之间的转换 *** //返回与 jQuery 选择器匹配的DOM元素的数量 jQueryArray.length; jQueryArray.size(); //从jQuery对象获得普通的DOM集合,[<li id="foo">, <li id="bar">] jQueryArray.get(); jQueryArray.toArray(); //根据index获取数组中的某个元素 jQueryArray.get(index); jQueryArray[index]; //当index是-1时,由于负数index是从数组最后开始算,所以返回数组的最后一个元素 jQueryArray.get(-1); //当从一个jQuery对象获得一个DOM元素后,把该元素再转变成一个jQuery对象,以便调用jQuery的方法 $(jQueryArray[0]);
注意:$()函数能把一个DOM元素转变为一个jQuery对象