Jak mogę odświeżyć przechowywaną i snapshotowaną zmienną selektora jquery

Question

Uruchomiłem wczoraj problem z selektorem jquery przypisanym do zmiennej i doprowadza mnie do szału.

Oto jsfiddle z testcase:

• przypisać .elem do mojego var obj
• dziennika oba odcinki do konsoli. Wynik => 4
• usunąć # 3 z DOM
• dzienniku obj do konsoli => usuniętą # 3 jest nadal istnieje, a długość jest wciąż 4. zorientowali się, że zapytanie jQuery jest snapshotted? do zmiennej i nie może? zostać zaktualizowany
• dziennika .elem do konsoli .. yep wynik => 3 i # 3 nie ma
• teraz zaktualizować .elem z nowym szerokości 300
• rejestrowania obj & obj.width daje mi 300 .. Więc migawka została zaktualizowana? Interesujące jest to, że 3 z 4 elementów div mają nową szerokość, ale usunięty # 3 nie ...

Kolejny test: Dodawanie elementu li do domtree i logowanie obj i .elem. .elem ma nowy i obj li nie, bo to nadal stary migawka

http://jsfiddle.net/CBDUK/1/

Czy nie ma sposobu, aby uaktualnić ten obj z nową zawartością? Nie chcę tworzyć nowego obiektu, ponieważ w mojej aplikacji jest wiele informacji zapisanych w tym obiekcie, nie chcę niszczyć ...

Answer 1

Tak, jest to migawka. Co więcej, usunięcie elementu z drzewa DOM strony nie spowoduje zniknięcia wszystkich odniesień do elementu.

Można odświeżyć ją tak:

var a = $(".elem"); 

a = $(a.selector); 

Mini-plugin:

$.fn.refresh = function() { 
    return $(this.selector); 
}; 

var a = $(".elem"); 

a = a.refresh(); 

To proste rozwiązanie nie działa ze złożonymi przechodzenia przez chociaż. Będziesz musiał utworzyć parser dla właściwości .selector, aby odświeżyć migawkę dla nich.

Format jest podobny:

$("body").find("div").next(".sibling").prevAll().siblings().selector 
//"body div.next(.sibling).prevAll().siblings()" 

W miejscu mini-plugin:

$.fn.refresh = function() { 
    var elems = $(this.selector); 
    this.splice(0, this.length); 
    this.push.apply(this, elems); 
    return this; 
}; 

var a = $(".elem"); 
a.refresh() //No assignment necessary 

Answer 2

Lubiłem też rozwiązanie @Esailija, ale wydaje się, że this.selector ma kilka błędów z filtrem. Więc zmodyfikowane do moich potrzeb, może to będzie przydatne dla kogoś

Było to dla jQuery 1.7.2 didn `testowej odświeżania filtrowanych migawek na wyższych wersjach

$.fn.refresh = function() { // refresh seletor 
    var m = this.selector.match(/\.filter\([.\S+\d?(\,\s2)]*\)/); // catch filter string 
    var elems = null; 
    if (m != null) { // if no filter, then do the evarage workflow 
     var filter = m[0].match(/\([.\S+\d?(\,\s2)]*\)/)[0].replace(/[\(\)']+/g,''); 
     this.selector = this.selector.replace(m[0],''); // remove filter from selector 
     elems = $(this.selector).filter(filter); // enable filter for it 
    } else { 
     elems = $(this.selector); 
    } 
    this.splice(0, this.length); 
    this.push.apply(this, elems); 
    return this; 
}; 

Code jest nie tak piękne, ale zadziałało dla moich filtrowanych selektorów.

Answer 3

Jquery .selector jest przestarzała, to lepiej do zapamiętania ciąg o wartości selektora do jakiejś zmiennej w momencie przypisania

function someModule($selector, selectorText) { 
    var $moduleSelector = $selector; 
    var moduleSelectorText = selectorText; 

    var onSelectorRefresh = function() { 
     $moduleSelector = $(moduleSelectorText); 
    } 
} 

https://api.jquery.com/selector/

Answer 4

Jeśli używasz remove() będzie usunąć tylko część DOM, ale nie wszystkie dzieci lub powiązane, zamiast tego, jeśli użyjesz empty() na elemencie, z którym zniknął problem.

np .:

$('#parent .child).find('#foo').empty(); 

Może to być przydatne dla kogoś!