jQuery 类选择器性能（困惑）

Posted 2023-03-05

【中文标题】jQuery 类选择器性能（困惑）

【英文标题】：jQuery class selector performance (confused)

【发布时间】：2011-09-04 23:47:42

【问题描述】：

那么$('table.selectable td.capable input:text') 比$('table.selectable td input:text') 更可取吗？换句话说，指定一个类会加速还是减慢选择（假设在这种情况下不是绝对需要）？

【问题讨论】：

这是个好问题。想问一个类似的问题。

运行您自己的基准测试。

关键是，它们不是同一个结果集，如果有<td>没有.capable类，仍然匹配。

@Orbling 这是真的。我想我应该指定这对这个问题的上下文没有影响。

是的，我是这么认为的，否则这个问题就没有实际意义了。正如我在回答中提到的那样，您不应该在选择器中包含冗余信息，它只会增加工作量而没有任何好处。如果它有助于代码清晰并且对性能的影响可以忽略不计，那么就保留它。

【参考方案1】：

我没有检查 Sizzle 的实现，但在最好的情况下，td 将映射到类似 getElementsByTagName() 和 .capable 到类似 getElementsByClassName() 的东西，如果有的话。所以两者在速度方面都可以媲美。

但是，据我所知，没有 getElementsByTagNameAndClassName() 方法，因此解析 td.capable 可能需要在 DOM 调用之后进行额外的过滤。所以，我很倾向于认为它会更慢。

当然，基准测试可以确定。

【讨论】：

好点。我要做一个基准测试，我会告诉你们的。

【参考方案2】：

所以我用 firebug 做了一些基准测试，在我在问题中列出的特定示例中，后者（没有 td 类说明符）更快。

【参考方案3】：

取决于上下文。

一般来说，需要进行的子检查越多，它就会越慢，因为每个都需要时间。关键是，它们显然不一定是相同的结果。一个是另一个的子集。

在大多数情况下，目标是使用最少数量的选择器来定位您需要的特定集合。还要记住，一些选择器的性能比其他选择器好得多（由于浏览器方法的可用性）。 ID 选择器#id 和现代浏览器中的标签选择器比.class 的类搜索要快得多，后者需要对.className 参数进行迭代字符串分析，或者实际上是基于属性的搜索，这通常是相同的。

如有疑问，请执行指标。