那么我们为什么要缓存 jQuery 对象呢？
在以下场景中：
var foo = $('#bar');
foo.attr('style','cool');
foo.attr('width','123');
$('#bar').attr('style','cool');
$('#bar').attr('width','123');
为什么第一个选项比第二个选项好这么多？
如果是因为性能，它是如何减少使用的？
为什么要缓存 jQuery 对象？
IT技术
javascript
jquery
performance
caching
2021-02-11 12:00:01
2个回答
因为 jQuery 函数中有很多代码，如果您使用相同的输入期望相同的输出多次执行它，则会涉及不必要的开销。通过缓存结果，您可以存储对您正在查找的确切元素或元素集的引用，因此您不必再次搜索整个 DOM（即使搜索速度相当快）。在许多情况下（带有少量代码的简单页面），您不会注意到差异，但在您这样做的情况下，可能会产生很大的差异。
您可以通过在 jsPerf 中测试您的示例来看到这一点。
您也可以将其视为Introduce Explaining Variable重构模式的一个示例，以提高可读性，尤其是对于比问题中的示例更复杂的示例。
jQuery 选择器$('#foo')在整个 DOM 中搜索匹配的元素，然后返回结果。
缓存这些结果意味着每次使用选择器时 jQuery 都不必搜索 DOM。
编辑：document.getElementById()是 jQuery 用于搜索 DOM 的内容，但 jQuery 永远不够用。