2010-06-22 14 views
91

¿Cuál es la diferencia entre los métodos empty() y remove() en jQuery, y cuando llamamos a alguno de estos métodos, los objetos que se crean se destruirán y se liberará la memoria?jQuery empty() vs remove()

Respuesta

145
  • empty() eliminará todos los contenidos de la selección.
  • remove() eliminará la selección y su contenido.

considerar:

<div> 
    <p><strong>foo</strong></p> 
</div> 

$('p').empty(); // --> "<div><p></p></div>" 

// whereas, 
$('p').remove(); // --> "<div></div>" 

Ambos eliminar los objetos DOM y debe liberar la memoria que ocupan, sí.

+1

¿Qué sucede con los controladores de eventos? Tengo un caso raro donde empty + append dos veces, con diferentes adjuntos hace que el segundo conjunto de elementos anexados ejecute los controladores del primer conjunto. – Killroy

+0

@way demasiado tarde, pero también eliminan el controlador. existe la posibilidad de que haya registrado a esos controladores con una función como 'live' o' delegate'. – undone

48

La documentación lo explica muy bien. También contiene ejemplos:

antes:

<div class="container"> 
    <div class="hello">Hello</div> 
    <div class="goodbye">Goodbye</div> 
</div> 

.Remove():

$('.hello').remove(); 

después:

<div class="container"> 
    <div class="goodbye">Goodbye</div> 
</div> 

antes:

<div class="container"> 
    <div class="hello">Hello</div> 
    <div class="goodbye">Goodbye</div> 
</div> 

.empty():

$('.hello').empty(); 

después:

<div class="container"> 
    <div class="hello"></div> 
    <div class="goodbye">Goodbye</div> 
</div> 

En lo que se refiere a la memoria, una vez que un ele Cuando se elimina el DOM del DOM y ya no hay más referencias, el recolector de basura recuperará la memoria cuando se ejecute.

+0

Respuesta excelente ... thnx :) – Bhupi

+0

vacío no tocará los atributos del selector. Si desea eliminar los atributos del elemento selector, noté que jQuery removeAttr y removeClass tienen errores en Firefox. Entonces, la opción que tenía era usar el método de eliminar y agregar el elemento contenedor de nuevo, luego anexar nodos secundarios al mismo. – randominstanceOfLivingThing

+0

de manera similar, ¿puede explicar detach() también con los respectivos de los dos anteriores ... – Krish

1

$("body").empty() - es elimina los elementos DOM HTML dentro del cuerpo de la etiqueta -

cuando se declara $("body").remove() - se retire todo el DOM HTML junto con el cuerpo de la etiqueta.

+15

¿Qué proporciona esta respuesta que falta en las respuestas existentes que han estado aquí por tres años? – jcsanyi