jQuery的更新變量引用DOM元素

Question

我有2個變量的設置是這樣的：

var carousel = $('div.carousel ul'); 
var pics = carousel.children('li'); 

上了一些新<li>後來被添加到使用insertBefore()轉盤但是我pics變量是已經過時的，所以我必須請在我的功能中再次撥打pics = carousel.children('li');。

有沒有更好的方式做到這一點，而不需要重複遍歷DOM？

Answer 1

jQuery有一個add()函數，它將接受一個參數並將其添加到所選項目的列表中。您可以在任何時候向DOM添加新的列表項目時致電pics.add(newli);。

Answer 2

爲什麼pics = carousel.children('li');這麼耗時？

如果列表發生了變化，這樣做似乎還可以，但如果您確實想避免它，請嘗試將新創建的li添加到新陣列中，然後添加圖片。

Answer 3

我喜歡存儲jQuery對象，以避免選擇器遍佈整個地方。所以我創建了一個微插件來擴展jQuery對象的功能。你可以找到the gist here

這裏是參考代碼：

(function ($) { 
    $.fn.update = function(){ 
    var newElements = $(this.selector),i, oldLength = this.length; 
    this.length = newElements.length; 
    for(i=0;i<this.length;i++){ 
     this[i] = newElements[i]; 
    } 
    for(;i<oldLength;i++){ 
     this[i] = undefined; 
    } 
    return this; 
    }; 
})(jQuery);