Javascript 缓存的Jquery选择器行为我不理解

给定以下代码，为什么

a

和

b

的值不同？我原以为他们会退回同样的东西：

(function() {
    var a = $('#foo');

    var Test = function(){
    console.log(a); //outputs 'jQuery()'
    var b = $('#foo');
    console.log(b); //outputs 'jQuery(select#foo)' which is what I want
    };
})();

这个问题源于我试图将常用的选择器插入变量。最初我在每个方法中都这样做（就像我在上面的示例中使用

var b

），但后来我发现我需要在多个方法中使用选择器，所以我将赋值移出，以便对匿名函数中的所有方法都可用（或者我认为是这样）。正如你所看到的，它不起作用。为什么会这样

---

编辑：此代码由单击触发的方法加载。id foo在页面加载时存在，不会动态设置或更改。

确保在页面加载完成之前不会调用代码

$(function() {
  // your code
});

---

当然，您还需要小心缓存客户端应用程序的其他部分可能会在页面上更改的内容。

只是为了改进前面的答案-b仅在调用测试函数时计算，可能是在加载页面后。将选择器缓存在“文档准备就绪”中：

 $(document).ready(function(){
   var a = $('#foo');
 });

我只在代码块中使用同一选择器时缓存选择器。我使用$variable命名约定：

var $divs = $('div');

还可以将函数链接在一起，以避免缓存选择器：

$('div').append('hello world').addclass('hello').show();

---

在我的实际代码中，它是一个函数，在提交表单时作为数据验证方法的一部分调用。无论如何，在页面加载之后。但是现在我想起来了，匿名函数本身可能没有在正确的时间加载。它由插件加载，但必须在页面完成之前加载（因此

#foo

不可用）。然后，在页面加载后，通过单击调用

Test（）

，使其正常工作。那很有帮助，谢谢！它在页面加载后调用。正在使用的ID已在html中设置。。。我认为这是最可能的罪魁祸首。将代码放入$（document）.ready（）事件可确保在运行该代码时可以访问DOM，并且jQuery对象将找到一个元素。