jQuery 真正支持哪些 CSS3 选择器，例如:nth-last-child()?

Question

根据http://api.jquery.com/category/selectors/，我们可以在 jQuery 中使用大量的 CSS 选择器，但是例如那里没有提到:nth-last-child()。但是，当我测试以下内容时（使用来自 Google 的 jQuery 1.7.1），它实际上适用于 Firefox、Chrome 和 IE 9，但不适用于 IE 8 仿真模式下的 IE 9：

$('li:nth-last-child(2)').css('color', 'red');

那么发生了什么？看起来 jQuery 生成了 CSS 代码，例如 li:nth-last-child(2) { color: red } 并以某种方式注入了它，然后在支持使用的选择器的浏览器上运行正常。但这会很奇怪。

最重要的是，是否有一些技巧可以让 jQuery 在所有浏览器上都支持此类选择器？

Answer 1

虽然 jQuery 在其 home page 上宣传符合 Selectors level 3 标准，但它并没有完全实现该规范。在它自己的Selectors 文档中，它阐明它“[借用] CSS 1-3，然后[添加]它自己的”选择器。¹

从 jQuery 1.9 开始，几乎所有 3 级标准中的选择器都被 Sizzle（其底层选择器库）支持，但以下情况除外：

• jQuery 不能选择任何伪元素为they are CSS-based abstractions of the document tree that can't be expressed through the DOM。

• jQuery 无法解析动态伪类，例如用于超链接的:link/:visited 和用于用户交互的:hover, :active and :focus。后一组伪类尤其是基于状态而不是基于事件的，因此当元素 enter 和 leave 这些状态。有关说明，请参阅 this answer。

• jQuery 也无法解析namespace prefixes，因为它不支持namespacing in CSS。

以下 3 级选择器 are implemented in jQuery 1.9 and newer，但 不是 jQuery 1.8 或更早版本²：

• :target
• :root
• :nth-last-child()
• :nth-of-type()
• :nth-last-of-type()
• :first-of-type
• :last-of-type
• :only-of-type

另外：

• CSS2 中引入的:lang() 也不见了。

您的选择器似乎在 Firefox、Chrome 和 IE9 中工作的原因是 jQuery 在返回到 Sizzle 之前首先将选择器字符串传递给原生的 document.querySelectorAll() 实现。由于它是一个有效的 CSS 选择器，document.querySelectorAll() 将成功返回一个节点列表供 jQuery 使用，从而避免使用 Sizzle。

如果document.querySelectorAll() 失败，jQuery 会自动回退到 Sizzle。有多种情况可能导致它失败：

• 选择器无效、不受支持或无法使用（有关详细信息，请参阅Selectors API spec）。

• 不支持 document.querySelectorAll() 方法本身（jQuery 实际上用一个简单的 if 语句对此进行了测试，因此它不会 fail 在这个词的意义上，但你明白了)。

在您的情况下，虽然 IE9 和 IE8 实现了document.querySelectorAll()，但 IE8 不支持:nth-last-child()。由于 jQuery/Sizzle 也没有实现 :nth-last-child()，因此没有可使用的回退行为，导致 IE8 完全失败。

如果您至少无法将 jQuery 更新到 1.9（向后兼容的发布分支），您始终可以使用自定义选择器扩展来自己实现缺少的伪类。但是，由于 jQuery 1.9 在保持与旧 IE 版本的兼容性的同时增加了对上述选择器的支持，因此如果您需要兼容性，最好至少更新到该版本。

---

¹_{它确实支持:contains()，最后在this old CR revision of the spec 中定义，后来被删除，以及从标准扩展:not()。 this question 中介绍了 jQuery 的实现与当前标准之间的差异。}

²_{其他一些选择器（如 + 和 ~ 同级组合器、:empty、:lang() 和一些 CSS2 属性选择器）将被删除为在 jQuery 的早期开发过程中很好，只是因为 John Resig didn't think anybody would use them。在进行了更多测试后，几乎所有这些都进入了最终版本。如上所述，:lang() 是唯一一个从未在 1.9 之前发布过的版本。}