如何了解jQuery选择器如何在幕后工作？

例如，当我们使用$('div span') ，jQuery如何对我们进行搜索？

它首先搜索span元素还是div ？

似乎jQuery官方网站对这些事情没有任何解释; 它只是向我们展示了API提供的function。

我想知道每种类型的jQuery选择器是如何实现的，所以我可以选择要使用的最佳选择器。

你知道我在哪里可以得到这样的信息吗？

Answer 1

从广义上讲，您需要了解的内容：

1. jQuery 从右到左读取选择器。
2. 使用确切的ID是最快的 ，然后使用精确的标记名称，因为它们使用优化的JavaScript本机方法。
3. 原生CSS选择器如:first-child 比jQuery选择器更快，比如:first 。

您还可以阅读官方的Sizzle文档 ，但它并没有真正讨论优化技术。

Answer 2

它首先搜索span元素。 它将选择器解析为：

1. tagName = span的任何元素
2. 拥有tagName = div的祖先

对于第一部分，它可以使用getElementsByTagName方法来查找所有span元素，然后它必须遍历每个元素的祖先以查找div元素。

Answer 3

最简单的地方是直接从源头阅读。 从jquery站点下载uncompresserd源代码，并从原始源读取它的作用和顺序。

http://jquery.com/download/

Answer 4

正如@Juhana评论的那样，如果你想知道jQuery基于其选择器选择对象的具体方法，请查看github存储库：

https://github.com/jquery/jquery/

或者，查看未压缩的jQuery下载中可用的源代码：

http://jquery.com/download/

如果您只是想知道哪些不同的选择器可用，jQuery在这里提供了它们的列表：

http://api.jquery.com/category/selectors/

Answer 5

它们是从右到左解析的。

请参阅http://csswizardry.com/2011/09/writing-efficient-css-selectors/以及为什么浏览器从右到左匹配CSS选择器？