为什么要缓存jQuery对象？

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(即使它是一个相当快速的搜索).在许多情况下(具有少量代码的简单页面),您不会注意到差异,但在您执行此操作的情况下,这可能会产生很大的差异.

您可以通过在jsPerf中测试您的示例来查看此操作.

为了便于阅读,您还可以将其视为介绍解释变量重构模式的示例,尤其是使用比问题中更复杂的示例.