8

私は通常、jQueryオブジェクトを変数に格納して、セレクターがいたるところに書き込まれないようにします。

DOMを変更するときは、オブジェクト自体を更新したいと思います。未使用の参照を削除し、新しい参照で更新します。これどうやってするの？理想的には、次のロジックで何かをしたいと思います。

var test = $('div.bar');
console.log(test);
>> [<div class="bar" id="b1"></div>, <div class="bar" id="b2"></div>]

$('#b2').remove();
console.log(test);
>> [<div class="bar" id="b1"></div>, <div class="bar" id="b2"></div>]

test.update();
console.log(test);
>> [<div class="bar" id="b1"></div>]

$('body').append('<div class="bar" id="b3"></div>');
console.log(test);
>> [<div class="bar" id="b1"></div>]

test.update();
console.log(test);
>> [<div class="bar" id="b1"></div>, <div class="bar" id="b3"></div>]
4

1 に答える 1

7

このプラグインはその問題を解決します：

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

それをコードに追加して、次のようにします。

var $foo = $("div.bar"); // selects all "div.bar"
(... many dom modifications ...)
$foo.update();
于 2012-12-30T11:54:36.843 に答える