缓存的JQuery选择器行为，我不明白

给定以下代码为什么我得到a和b不同的值？我原以为他们会返回相同的东西：缓存的JQuery选择器行为，我不明白

(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在页面加载时不会动态设置或更改。

来源

2010-03-30 Stuart

当'Test'叫什么名字？ – 2010-03-30 17:09:21

在我的实际代码中，它是一个函数，当提交表单时，它将作为数据验证方法的一部分被调用。无论如何页面加载后。 – Stuart 2010-03-30 17:29:42

但现在我想到了，匿名函数本身可能不会在恰当的时间加载。它由一个插件加载，但必须在页面完成之前加载（因此'＃foo'不可用）。然后，'Test（）'在页面加载后通过点击被调用，所以自然会起作用。这有助于，谢谢！ – Stuart 2010-03-30 19:07:34

确保在页面加载完成后才能调用代码！

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

而且，当然，你要小心，可能在页面上由您的客户端应用程序的其他部分来改变缓存的东西。

来源

2010-03-30 17:10:50 Pointy

它在页面加载后调用。正在使用的ID在html中设置...它不会以任何方式更改或动态显示。 – Stuart 2010-03-30 17:31:20

只是为了改进上一个答案 - 只有在调用Test函数时才会对b进行评估，可能一旦加载页面。缓存文档中的选择器准备好：

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

我只在一段代码中使用相同的选择器时缓存选择器。我使用这个变量$命名约定：

var $divs = $('div');

您也可以链功能整合在一起，以避免缓存选择：

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

来源

2010-03-30 17:28:53

我会说这是最有可能的罪魁祸首。将代码放入$（document）.ready（）事件中可以确保在代码运行时访问DOM，并且jQuery对象将找到一个元素。 – Bob 2010-03-30 17:37:25

缓存的JQuery选择器行为，我不明白

回答

相关问题