有很多问题要求缓存jQuery对象,但是我找不到一个问一个jQuery对象可以和应该缓存的地方.我有一个网页,其中包含一个包含一系列功能的JavaScript文件,如下所示.
$(document).ready(function () {
// do some setup
});
/* function queries the DOM with the same selector multiple times without caching */
function myFunctionOne() {
$('#name_input').css("border","1px solid #ccc");
$('#name_input').val(someValue);
}
/* function uses cached object from a single query */
function myFunctionTwo() {
var nameInput = $('#name_input')
nameInput.css("border","1px solid #ccc");
nameInput.val(someValue);
// do some other stuff with cached selector
}
Run Code Online (Sandbox Code Playgroud)
在myFunctionOne我低效地查询DOM两次,而在myFunctionTwo我查询DOM一次,将结果缓存在局部变量中,然后使用该变量.我知道这种方法myFunctionTwo更有效但我不确定我应该在哪里实际缓存这些对象.在那一刻我在方法级别缓存对象,但我想知道我是否可以实际缓存它在更高级别,然后在多个函数中使用它.这样我只会查询一次DOM,然后在该文件的所有函数中重用结果.我建议的一个例子如下所示.
$(document).ready(function () {
// do some setup
var nameInput = $('#name_input')
}); …Run Code Online (Sandbox Code Playgroud)