我可以在 jQuery 中缓存 $(window) 和 $(document) 吗？答案

【问题标题】：Can I cache $(window) and $(document) in jQuery?我可以在 jQuery 中缓存 $(window) 和 $(document) 吗？
【发布时间】：2026-01-11 04:15:01
【问题描述】：

我最近阅读了一些关于 jQuery 性能的文章，并提出了一些奇怪的问题。

我可以/应该缓存$(window)吗？

如果我这样做了，会影响resize、scroll、width、scrollTop...等吗？
我可以/应该缓存$(document)吗？

由于我们使用了很多鼠标操作，我应该使用var doc = $(document);吗？
我可以总是在一大段代码中缓存$(this)吗？

至于var self = $(this);，在什么情况下self可能不同于$(this)？

【问题讨论】：

您可以缓存$(window)，但您是否配置文件以检查这对您的应用程序是否有用？
当$(this) 可能会根据范围发生变化时，使用var self = $(this) 很有用，并且您需要参考原始$(this)
我同意你不应该称之为缓存。但是jquery的人就是这么做的。所以我们可能会坚持下去以更好地理解。
@Johan 好吧，我从那些“教程”中学到了caching 这个词。如果您用 Google 搜索 jQuery performance，您可能会发现 99/100 的文章都在说 cache your object: var foo = $("#bar");。
缓存是一个透明地存储数据的组件，以便可以更快地处理未来对该数据的请求。如果这是内存或变量，它仍在缓存中。

标签： jquery performance caching

【解决方案1】：

所有三个问题：是的，你可以！

必需品：没有

更好的性能：也许

您可以尝试做一个基准测试。但是缓存的原因并不是要在整个 DOM 中搜索您的选择器。查找文档和窗口不是问题，因为它们是 2 个根变量。缓存 $(this) 取决于情况。请参阅我的第二个提示。

始终缓存您对其运行查询的父对象：

var header = $('#header');
    
var menu = header.find('.menu');
// or
var menu = $('.menu', header);

链接 jQuery 方法比缓存选择器更好：

$('li.menu-item').click(function () {alert('test click');})
                     .css('display', 'block')
                     .css('color', 'red')
                     fadeTo(2, 0.7);

缓存您经常查询的元素：

var header = $('#header');
var divs = header.find('div');
var forms = header.find('form');

免费的额外性能提示：

选择器从快到慢：

Id > Tag > classes

【讨论】：

这就是我这些天一直在阅读的内容。你能专注于我问的 3 个问题吗？
好吧，前 2 个问题，不，您可以尝试做一个基准测试。但是缓存的原因并不是要在整个 DOM 中搜索您的选择器。查找文档和窗口不是问题，因为它们是 2 个根变量。缓存 $(this) 取决于情况。请参阅我的第二个提示。更新了答案。

【解决方案2】：

是的，您可以缓存 $(window)，它确实有助于提高性能。
有人已经在 jsperf 中做过测试。 http://jsperf.com/jquery-window-cache

测试结果有点乱，但您仍然可以“运行测试” 你的浏览器看看有什么不同。
是的，您也可以缓存 $(document)。我很少使用 $(document)，但基于我在 jsperf 中所做的测试 (http://jsperf.com/document-vs-cache)，缓存 $(document) 对性能也有点。
是的，您可以缓存 $(this)。但是这个和之前的不一样其他cahces。如您所知，$(this) 的值会改变取决于不同的情况。例如，如果您在鼠标中使用 $(this) 像这样的听众……
```
$(".button").on("click",function(){
   var $this = $(this);
}); 
```
$(this) 将在用户单击带有类的按钮时更改 "button", $("this") 将成为被点击的对象用户。

如果您经常使用 $(this)，缓存 $(this) 有助于提高性能函数内部。但请记住，如果你在里面缓存 $(this) 函数，缓存将成为局部变量而不是全局变量，并将在函数结束时销毁。所以你将无法在函数外使用它。

【讨论】：

【解决方案3】：

实际问题是，Can I cache $(window) and $(document) in jQuery?

如果您想缓存窗口或文档以在同一会话中进一步使用，可以。

如果用户关闭窗口/会话，您创建的所有变量/函数都将被垃圾回收。

【讨论】：