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

Question

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

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

  如果我这样做，会影响resize、scroll、width、scrollTop...等吗？

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

  由于我们使用了大量的鼠标操作，我应该这样做var doc = $(document);吗？

• 我可以始终将$(this)缓存在一大段代码中吗？

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

Answer 1

所有三个问题:是的，你可以!

必需品:没有

更好的性能:也许

您可以尝试做一个基准测试。但缓存的原因并不是要在整个 DOM 中搜索选择器。查找文档和窗口不是问题，因为它们是两个根变量。缓存 $(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