jQuery选择器是否返回HTML Element或jQuery对象的数组?
什么存储在Q
?
Q = $('div'); Q2 = document.getElementsByTagName('div');
我可以使用Q[index]
访问每个HTML元素,类似于Q2[index]
; 这使得Q
看起来像是一个HTML元素数组。
另一方面,我可以做Q.filter()
,但我不能做Q2.filter()
; 这使得Q
看起来像是jQuery对象的数组。
或者它是两者, Q
是一个jQuery对象,其中包含一堆HTML元素? 如果是这种情况, console.log()
会不会将Q
检测为一个包含对象集合的对象? 这个小提琴, http://jsfiddle.net/rkw79/3s7tw/ ,表明它们是相同的。
注意:我知道Q.eq(index)
将返回一个可以使用jQuery方法的对象。 我只是想知道究竟是什么Q
结果是一个jQuery
对象,其行为类似于使用[]
获得的HTMLElements
array
和使用eq(index)
获得的jQuery
对象array
;
在您的示例中, q
(jQuery对象)是一个类似于数组的对象 ,它实际上是一组选定DOM节点的包装器。 考虑这个例子:
HTML:
JS:
alert($("#example")) //Alerts something like "Object" alert($("#example")[0]) //Alerts something like "HTMLDivElement" alert(document.getElementById("example")); //Alerts something like "HTMLDivElement"
上面的第二个示例访问集合中的第一个原始DOM元素(在这种情况下,只有一个)。 您可以通过使用jQuery get(index)
方法实现相同的function,但我使用常规数组语法来演示jQuery对象与数组类似。
jQuery包装器对象允许您将其他jQuery方法应用于匹配的元素集。 DOM元素本身没有这些方法,这就是为什么在你的例子中Q2.filter()
不起作用的原因。
Q2
是原始DOM元素。 由于jQuery对象实际上是一组DOM元素的包装器,因此完全可以这样做:
alert($(document.getElementById("example"))); //Alerts something like "Object"
在该示例中, getElementById
返回DOM元素,然后将其传递给jQuery函数,该函数返回类似数组的jQuery对象,允许您调用其他jQuery方法。
Q是一个对象。 它欺骗并伪装成一个arrays来实现所有常见的数组函数,因此firebug就是这样对待它的。 (或者它可能以数组开头,但添加了一些东西。)
它包含一个包含所有先前所选元素的堆栈(因此您可以使用.end()
)它具有匹配元素的实际数组,这就是它。
尝试:
for(i in $('body')) console.log(i)
你会看到所有的function等。