我知道jQuery不缓存元素,f.ex调用的集合:
$('。myclass') .html('hello'); $('。myclass')。html('bye');将jQuery爬上DOM两次。
但是如何缓存DOM节点?
var elems = document.querySelectorAll('。myclass'); $(elems).html('hello'); $(elems).html('bye');会在内部缓存这些内容,还是会像第一个例子一样缓慢?澄清:jQuery会引用 elems 并缓存 $ (elems),所以它不必每次都应用相同的 $()包装器?
类似:
cache = {} constructor = function(collection)如果缓存中的集合 return cache [collection] else construct(collection)解决方案
假设我已经正确理解了你的问题,那么没有,jQuery将不会保留对使用它们的语句之外的所选节点的引用:
$('。myclass')。html('hello'); //选择所有.myclass元素,然后更改它们的HTML $('。myclass')。html('bye'); //选择所有.myclass元素,然后再次更改它们的HTML节点,它会更快:
var elems = document.querySelectorAll('。myclass'); //选择所有.myclass元素 $(elems).html('hello'); //改变他们的HTML(不需要选择它们) $(elems).html('bye'); //改变它们的HTML(不需要选择它们)您的DOM很复杂),但会有不同:
>
更新
elems和cache $(elems),所以它不会每次都应用相同的$()包装器。
不,它不会。如上所述,对匹配的元素集合的引用将不会被保持超出其应用的语句。您可以通过保持对整个使用的jQuery对象的引用,而不是每次都选择它们,或者甚至每次将一个存储的本机DOM节点集合包含在jQuery对象中来提高代码的性能。
I know jQuery doesn’t cache collections of element, f.ex calling:
$('.myclass').html('hello'); $('.myclass').html('bye');Will make jQuery climb the DOM twice.
But how about cached DOM nodes?
var elems = document.querySelectorAll('.myclass'); $(elems).html('hello'); $(elems).html('bye');Will jQuery cache those internally, or will they be equally slow as the first example?
To clarify: will jQuery keep a reference to elems and cache $(elems) internally so it won’t have to apply the same $() wrapper every time?
Something like:
cache = {} constructor = function(collection) if collection in cache return cache[collection] else construct(collection)解决方案
Assuming I've understood your question correctly, then no, jQuery won't keep a reference to the selected nodes beyond the statement that uses them:
$('.myclass').html('hello'); //Select all .myclass elements, then change their HTML $('.myclass').html('bye'); //Select all .myclass elements, then change their HTML againIf you maintain a reference to those selected nodes separately, it will be faster:
var elems = document.querySelectorAll('.myclass'); //Select all .myclass elements $(elems).html('hello'); //Change their HTML (no need to select them) $(elems).html('bye'); //Change their HTML (no need to select them)The difference won't be massive (unless your DOM is very complicated) but there will be a difference:
Update
will jQuery keep a reference to elems and cache $(elems) internally so it won’t have to apply the same $() wrapper every time?
No, it won't. As stated above, the reference to the matched set of elements will not be maintained beyond the statement to which it applies. You can improve the performance of your code by keeping a reference to jQuery objects that are used throughout, rather than selecting them again each time, or even wrapping a stored set of native DOM nodes in a jQuery object each time.
更多推荐
jQuery缓存元素在内部?
发布评论