È necessario chiamare empty() prima di html() o prima di innerHTML?

Question

Ho un plugin popup che imposta il contenuto html di un <div/> con la risposta di una chiamata AJAX.

Ogni volta che apro il popup, nel codice ho appena chiamato $("#popup").html(response). Questo sovrascrive il contenuto html esistente con il nuovo contenuto.

Devo chiamare lo $("popup").empty() prima di chiamare lo $("popup").html(response) in modo da liberare la memoria del browser utilizzata dagli oggetti che erano precedentemente nel div $("popup")? (eventualmente prevenire perdite di memoria)

PS: cosa succede se chiamo $("popup")[0].innerHTML = response? dovrei chiamare il metodo .empty()?

Answer 1

Risposta breve n.

jQuery.fn.html utilizza DOMNode.innerHTML = dopo aver eseguito diverse altre operazioni. Uno è quello di rimuovere tutti i dati memorizzati sui nodi (memorizzati tramite $.fn.data), vedere http://james.padolsey.com/jquery/#v=git&fn=jQuery.fn.html per la panoramica completa dell'origine.

.innerHTML rimuove i bambini e sostituisce con il nuovo html. Ma attenzione alle perdite di memoria. Vorrei usare jQuery.fn.empty prima di impostare innerHTML. per esempio.

var a = document.createElement('div'), 
    b = document.createElement('div'); 

    b.appendChild(a); 

    b.innerHTML = 'new innerHMTL'. 

Si potrebbe pensare che tutto sia a posto. Ma il nodo sostituisce/rimosso è ancora catturato nella variabile a e quindi non viene lanciato al garbage collector. Non sono sicuro indipendentemente da fatto che jQuery negozi DOMNodes interna fino a quando si chiama jQuery.removeData ecc

Answer 2

Non è necessario chiamare empty(). html (response) metodo ovverides il existing content.

Answer 3

JQuery la documentazione del metodo di html dice:

Quando .html() viene utilizzato per impostare il contenuto di un elemento, qualsiasi contenuto che era in quel elemento è completamente sostituito dal nuovo contenuto. Inoltre, jQuery rimuove altri costrutti come dati e gestori di eventi da elementi figlio prima di sostituire tali elementi con il nuovo contenuto.

Quindi non è necessario chiamare empty().

Answer 4

Nessuna differenza tranne .empty() è più veloce e .html() può sovrascrivere il contenuto del contesto

http://jsperf.com/jquery-empty-vs-html/17