使用jQuery来缓存DOM元素

我很努力地使用命名约定，我想为DOM元素的缓存变量提供一个约定。使用jQuery来缓存DOM元素

到目前为止，我已经进步到使用此：

window.x = $('#x');

现在当然，这使它成为全球范围内，但根据我的习惯，这是确定。

但问题是，看着window.x并没有告诉我，它是$（'＃x'）的缓存变量。所以现在我想尝试的是使用jQuery插件技术来存储这些值。喜欢的东西：

;(function($, window, undefined) { 
    $.fn.x = function() { 
     return $('#x'); 
    } 
})(jQuery, window);

这样的话，我可以参考$ x.val（），它会立即传达给我，$ x是$（ '＃X'）DOM元素的缓存。

问：我将如何创建一个名为x的插件，它是$（'＃x'）选择器的返回值？我在做对吧？现在，你可能会说（在你最好的办公场所的声音）“这是一个可怕的想法”，但我只是在试验。

来源

2013-03-21 Phillip Senn

哦，我不知道这是否是一个可怕的主意。但是我有一个更简单的方法 - 我只在一个正常变量的开头放置了一个美元符号（我也使用$作为jQuery的别名）：'$ this = $（this）'或'$ widget = $（'＃widget'）' – 2013-03-21 19:12:59

将您的变量范围局限于您的函数，请勿将它们保留在全局范围内。如果它们是jQuery集合，则用'$'作为变量名称的前缀。这整个缓存废话**是一个可怕的想法。缓存用于提高性能，但由于JavaScript是异步运行的，99％的时间性能不是问题，因为您会花费太多时间闲置。 – zzzzBov 2013-03-21 19:14:26

我想不出缓存DOM元素的原因。对于初学者来说，如果您使用的是jQuery id选择器，那么这些选择器是最快的选择器类型，所以不需要缓存DOM元素。在示例中添加到全局名称空间时，只需创建一个快捷方式或别名，用于选择ID为“x”的元素。在我的代码中，我使用立即调用的函数表达式（IIFE）来封装我的代码的一个范围部分。如果要重复引用它们，我会在开头放置全局变量。这里有一个例子：

// An immediately-invoked function expression wraps all JavaScript code to keep it scoped to this module. 
(function ($) { 
    // Closure-local variables. 
    var $grid; 
    var $table; 
    // etc. 

    // Bind an initialize event. Will be called when this code needs to execute. 
    $(document).on('initialize', initialize); 

    // Initialize the global variables. 
    function initialize() {  
     $grid = $('#grid'); 
     $table = $('#table'); 

     // other setup... 
    } 

})(jQuery);

我用得到触发的initialize事件当页面最初加载，它设置全局变量，并设置了IIFE。 IIFE保持你的代码独立于所有其他代码，并且“缓存”的元素仅仅是初始化事件中设置的全局变量，所以你不必重复地调用它们。

来源

2013-03-21 19:21:55 Halcyon

使用jQuery来缓存DOM元素

回答

相关问题