在JQuery中查找节点的成本是多少?

What is the cost of finding a node in JQuery?

本文关键字：多少 JQuery 查找 节点      更新时间：2023-09-26

我总是保存find()的结果，以便在需要该值多次时避免多次遍历子树:

var $a_bar = $('div.foo').find('a.bar');
$a_bar.removeClass(...);
// ... code here
$a_bar.bazz();

代替

$('div.foo').find('a.bar').removeClass(...);
// ... code here
$('div.foo').find('a.bar').bazz();

我想知道这是不是一个微优化…那么在JQuery中找到一个节点的成本/复杂度是多少呢?

您可以在jsperf: http://jsperf.com/上进行测试创建一个测试并运行它。

我在这里创建了一个小测试:http://jsperf.com/jquery-find55

在我的浏览器(firefox 18):

  • 测试1(我保存查找结果)分数在7,074操作秒
  • 测试2(我不保存查找结果)分数在1553操作秒

所以，是的，find是"慢"，这绝对是一个好主意，将其存储在一个变量

如果您要多次重用变量，那么像您正在做的那样cache它们绝对是一个好主意。

.find()遍历在它之前传递的jQuery对象，所以它只查看已经给定的内容，使其非常快。

var $mainElement = $('#whatever'),
    $innerLIs  = $mainElement.find('li'),
    $innerTDs  = $mainElement.find('td');
// Now that these are cached in memory, doing anything to them is very quick
$innerLIs.hide();
// etc etc

如果我们继续查询它们，它每次都必须遍历DOM。一旦完成，它将每次都将它包装在一个jQuery对象中。

jQuery的选择是众所周知的昂贵的，然后运行.find更是如此。缓存对象绝对是一个好主意，而且从DRY的角度来看，在风格上也是有利的。

如果要多次操作同一件事，最好使用变量。

这样你只是在操作，而不是每次都先查找。

我删除了关于缩短代码的声明-这里有一篇关于jQuery选择器和"从右到左"思维的net-tuts文章

相关文章：