为什么jquery选择器返回一个数组而不是元素本身？

Question

如果我有一些看起来像的标记：

<div class="box">
</div>

为什么做jquery选择器$('.box')会返回数组中的元素？

我在控制台中得到一个输出：

[<div class="box"></div>]

而不是：

<div class="box"></div>

Answer 1

（有效）选择器不保证与单个元素匹配，但 保证代表一组匹配的元素可能

• 是空的，
• 有一个元素，或
• 有多个元素。

此集合最好由包含零个或多个元素的集合对象表示。

如果您的标记包含多个.box元素，那么如果不是由两个元素组成的集合，您希望jQuery返回什么？ document.querySelector()的不同之处在于方法旨在返回每个规范的第一个匹配元素，这就是document.querySelectorAll()存在的原因（这是jQuery在默认为自己之前内部使用的内容）实现）。

Answer 2

因为它不是数组，所以它是一个类似数组的jQuery对象。您可以像$()一样使用$().css().append()返回的对象，就像将链接方法链接在一起一样。

它类似数组的另一个原因是因为你提供的选择器实际上可以抓取许多不同的元素，你可以在jQuery对象上调用的大多数方法都会影响你的选择器选择的所有dom元素。 / p>

我希望这会有所帮助，我希望你能对jQuery及其工作方式进行更多的研究。它是一个非常有用的图书馆，它似乎还没有完全理解。

编辑：正如其他人所提到的，如果你只是想从jQuery对象中获取一个元素而只是使用jQuery作为选择器，你可以使用括号访问器$(...)[0]或get方法$(...).get(0)。 / p>

Answer 3

来自Rick Strahl说明

选择器返回一个称为“包装集”的jQuery对象，它是一个类似于数组的结构，包含所有选定的DOM元素。您可以像数组一样迭代包装的集合，也可以通过索引器访问单个元素（例如$（sel）[0]）。更重要的是，您还可以对所有选定的元素应用jQuery函数。