jQuery 真的支持所有 CSS3 选择器吗？ :nth-last-child() 之谜及其他。

解开 jQuery 的 CSS3 选择器支持：揭秘 :nth-last-child() 及其他

虽然 jQuery 拥有对 CSS 数组的支持选择器，它的 CSS3 功能可能会让您感到困惑。一个这样的例子是 :nth-last-child() 选择器，它似乎可以在 Firefox、Chrome 和 IE 9 等现代浏览器中运行，但奇怪的是官方文档中却没有。

jQuery 的选择器架构

jQuery 的选择器实现依赖于双管齐下的方法。它最初尝试利用本机 document.querySelectorAll() 方法，提供与最新 CSS 选择器的兼容性。如果这种方法失败，jQuery 会依靠它自己的选择器库 Sizzle。

此策略对 :nth-last-child() 在某些浏览器中的明显功能提供了解释。作为有效的 CSS 选择器，支持 document.querySelectorAll() 的浏览器（例如 Firefox、Chrome 和 IE 9）可以直接处理它并返回适当的节点列表，有效绕过 Sizzle。

揭秘支持的 CSS3 选择器

从 jQuery 1.9 开始，Sizzle（jQuery 的选择器库）几乎支持选择器级别 3 标准中定义的所有 CSS3 选择器，但有一些值得注意的例外：

• 伪元素：显式选择是不可能的，因为它们基于 CSS 的体现作为文档树的抽象。
• 动态伪类：基于事件不支持 :hover、:active 和 :focus 等伪类。相反，必须使用事件处理程序在元素进入和离开这些状态时执行代码。
• 命名空间前缀： jQuery 不处理 CSS 中的命名空间。

jQuery 1.9 中引入的选择器

在 jQuery 1.9 中，一系列 3 级选择器变得可用，包括：

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

兼容性注意事项

jQuery 1.8 及更早版本缺乏对上述选择器以及 CSS2 选择器 :lang() 的支持。

:nth-last-child() 的情况

在使用 :nth-last-child() 的示例中，Firefox、Chrome 和 IE 9 成功处理了选择器，因为这些浏览器支持 document.querySelectorAll()。但是，IE 8 模拟模式会失败，因为它不支持 :nth-last-child()。由于 jQuery/Sizzle 也没有实现这个选择器，所以没有后备机制，导致失败。

弥合差距

如果无法升级到 jQuery 1.9 或更高版本，您可以考虑使用 jQuery 的自定义选择器扩展来实现缺失的伪类。值得注意的是，jQuery 1.9 提供了与旧版本 IE 的兼容性，同时添加了对上述选择器的支持。

以上是jQuery 真的支持所有 CSS3 选择器吗？ :nth-last-child() 之谜及其他。的详细内容。更多信息请关注PHP中文网其他相关文章！