jQuery遍历vs伪类

Question

我想知道jQuery选择器中遍历和伪类之间的区别。

在包含以下内容的DOM中：

<ul id="destination">
  <li>A</li>
  <li>B</li>
</ul>

以下jQuery代码将选择相同的元素：

# Pseudo class
$("#destination li:first");

# Traversing
$("#destination").find("li").first();

我听说第二种方式更有效率，尽管需要更多的键盘。什么是最佳做法？

Answer 1

您可以通过F12开发人员工具衡量效率。例如，这是使用jQuery 2.1.2-pre的这两种方法中Internet Explorer中Profiler的输出。

以下是使用$.fn.find和$.fn.first的结果。你会注意到它比使用伪类要少得多。

如上所述，使用伪类（非标准Sizzle语法 - 糖）需要更多的工作：

结果不言而喻。虽然这些结果明显不同，但不要让它以某种方式影响你。使用适合您项目的内容。实际的性能差异可以忽略不计，并且不值得您关注。