Question

那么我们为什么要缓存jQuery对象？

在以下情形中：

var foo = $('#bar');
foo.attr('style','cool');
foo.attr('width','123');

$('#bar').attr('style','cool'); $('#bar').attr('width','123');

为什么第一个选项比第二个选项好得多？

如果是因为性能，它如何减少使用？

Answer 1

因为jQuery函数中有很多代码，如果你使用相同的输入执行多次预期相同的输出，这会产生不必要的开销。通过缓存结果，您可以存储对您要查找的确切元素或元素集的引用，这样您就不必再次搜索整个DOM（即使搜索速度相当快）。在许多情况下（具有少量代码的简单页面），您不会注意到差异，但在您执行此操作的情况下，这可能会产生很大的差异。

testing your example in jsPerf可以看到这一点。

为了便于阅读，您还可以将其视为Introduce Explaining Variable重构模式的示例，尤其是使用比问题中更复杂的示例。

Answer 2

jQuery选择器$('#foo')在整个DOM中搜索匹配的元素，然后返回结果。

缓存这些结果意味着每次使用选择器时jQuery都不必搜索DOM。

编辑：document.getElementById()是jQuery用来搜索DOM的，但是jQuery永远不够。

为什么要缓存jQuery对象？

2 个答案: