css - 评估 CSS 选择器 LTR 或 RTL 是否更容易/更快？

Question

给定一个 CSS 选择器，例如

ul > li a

从左到右或从右到左评估它会更容易/更快吗？ (我意识到“简单”和“更快”的答案可能不同。我想要两者的答案)。我即将踏上其中一条道路，我不想走到一半，然后意识到我选择了错误的道路:)

LTR:遍历文档中的所有元素，挑选出 ul 的元素，然后检查它们的所有子元素是否为 li，然后查看它们的后代元素对于 a。

RTL:遍历文档中的所有元素，找到所有的a，过滤掉那些没有祖先是li的元素，如果它确实有一个 li 祖先，检查它的父级是否是 ul，如果不是，则删除 a。

此外，除了遍历所有元素之外，真的没有其他方法可以做到这一点吗？

---

我在查找元素的上下文中思考，就像 jQuery 所做的那样，而不是在应用样式的上下文中进行思考。

Answer 1

浏览器和 Sizzle 选择器 JS 引擎(在 jQuery 和其他框架中使用的引擎)使用从右到左匹配。

在大多数情况下，从右到左是最佳的遍历解决方案。

Sizzle 优化以 ID 开头的选择器。它首先解析具有 ID 的元素。然后它将其用作进一步遍历的上下文。

所以如果你有选择器

#myID > ul a

Sizzle 将首先找到带有#myID 的元素，假设在这种情况下，从左到右更优化。