Sizzle和document.querySelectorAll的区别是什么？

Question

据我所知，Sizzle和querySelector/querySelectorAll是CSS选择器。所以..。加载Sizzle和执行之间有什么区别：

Sizzle("my CSS query")

和

document.querySelectorAll("my CSS query")

另外，我知道Sizzle返回一个元素数组，而querySelectorAll返回一个NodeList (在大多数浏览器中)。我还知道，您需要加载Sizzle，并且只能对一个元素使用document.querySelector。

那么，在性能上还有其他的区别吗？

编辑：我的问题只是关于Sizzle选择器引擎(和querySelectorAll)。请不要涉及jQuery。

Answer 1

Sizzle是一个纯JavaScript选择器引擎，旨在方便地放到主机库中。

他们说，这是jQuery项目的副产品，但当涉及到jQuery和Sizzle之间的区别时，JQuery是一种简化javascript复杂语法的库构建，人们发现这些语法很难理解，并且得到了一个特别是初学者的网格。因此，如果您使用的是JQuery，那么就会有大量的开销，而在这里，sizzlers提供的开销相对较少。

它倾向于使用querySelector而不是Sizzler，因为它只是一个额外的开销，可以很容易地用VanillaJS来完成，所以为什么要浪费它。他们都做同样的事。

Answer 2

Sizzle是在querySelectorAll不存在的时候创建的。在querySelectorAll的引入之后，它的开发得以继续，以解决早期的querySelectorAll实现中的浏览器错误。

Sizzle本身试图直接使用querySelectorAll，并且只会使用它自己的DOM遍历，如果选择器不受支持，或者知道对于给定的浏览器版本是错误的。因此，对于现代浏览器来说，性能上不应该有明显的差异，因为在这两种情况下都会使用querySelectorAll。

与querySelectorAll相比，Sizzle允许定义自定义伪选择器，其缺点是您无法从当前querySelectorAll提供的性能中获益。

所以现在，如果您不需要定制的伪选择器，那么就不再需要Sizzle了。只有当您需要针对已知有缺陷的旧浏览器版本时，您才会使用它。