jQuery选择器是否返回HTML Element或jQuery对象的数组？

Question

什么存储Q？

Q = $('div');
Q2 = document.getElementsByTagName('div');

我可以通过使用来访问每个HTML元素Q[index],类似于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

Answer 1

其结果是jQuery,其行为像两者的阵列的对象HTMLElements,你开始使用[]和array的jQuery,你开始使用对象eq(index);

Answer 2

在您的示例中,q(jQuery对象)是一个类似于数组的对象,它实际上是一组选定DOM节点的包装器.考虑这个例子:

HTML:

<div id="example"></div>

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)方法实现相同的功能,但我使用常规数组语法来演示jQuery对象与数组类似.

jQuery包装器对象允许您将其他jQuery方法应用于匹配的元素集.DOM元素本身没有这些方法,这就是为什么在您的示例Q2.filter()中不起作用的原因.

Q2是一个原始的DOM元素.由于jQuery对象实际上是一组DOM元素的包装器,因此完全可以这样做:

alert($(document.getElementById("example"))); //Alerts something like "Object"

在该示例中,getElementById返回DOM元素,然后将其传递给jQuery函数,该函数返回类似于数组的jQuery对象,允许您调用其他jQuery方法.

Answer 3

Q 是一个对象。它欺骗并假装是一个数组来实现所有常用的数组函数，因此 firebug 会这样对待它。（或者它可能作为一个数组开始，但添加了一些东西。）

它包含一个包含所有先前选定元素的堆栈（因此您可以使用.end()）它有一个匹配元素的实际数组，仅此而已。

尝试：

for(i in $('body')) console.log(i)

您将看到所有功能等。