2012-02-07 17 views
11

Estoy tratando de eliminar todo en todo el cuerpo, a excepción de un solo elemento y sus hijos. ¿Cómo puedo lograr esto?jQuery: seleccione todo excepto un solo elemento y sus elementos secundarios.

Editar 1 Considere el siguiente marcado:

<html> 
    <body> 
     <div id="div1"></div> 
     <div id="div2"> 
     <div id="elementNotToRemove"></div> 
     </div> 
     <div id="div3"></div> 
     <div id="div4"></div> 
    </body> 
</html> 

En el ejemplo anterior, quiero eliminar div1, div3 y DIV4, así como a sus hijos, pero conservar div2, ya que contiene el elemento no eliminar

Respuesta

19
$("body > *").not("body > #elementtokeep").remove(); 

Puede reemplazar la parte no() con lo que usted quiere mantener

+0

Pero, ¿y si la profundidad de los elementos es más profunda que la de los niños directos del cuerpo? –

+0

Eliminar un elemento también eliminará a todos los niños –

+0

Sí, pero eso no es lo que quiero decir. Aclaré un poco en el queston original. –

4

Puede hacerlo de esta manera:

$('body > *:not(#dondelete)').remove(); 

Cuando el elemento tiene id="dondelete" y es un hijo del cuerpo .

1

Trate

$('body > *:not(#123)').remove() 

http://api.jquery.com/not-selector/

+0

¿Quién los vota por arriba? Esto solo seleccionará el elemento 'body' en sí. – kapa

+0

@bazmegakapa probado y corregido –

+1

Ahora es lo mismo que otras soluciones (ya correctas) publicadas anteriormente, por lo que sería justo eliminar las suyas. Sin embargo, eliminé el voto negativo. – kapa

3

Ésta es una vieja pregunta, pero la respuesta aceptada es erróneo. No funciona en esta situación (ver http://jsfiddle.net/LVb3V/) y ciertamente no como una solución general.

mejor utilizar:

$('body *').not('#div2, #div2 *').remove()​;

Esto eliminará todos los elementos en el cuerpo a excepción de div2 y todos los elementos que contiene.

+1

¡Gracias! Esta debería ser la solución aceptada. La gran diferencia aquí es el jquery ".no "en lugar de usar no en el selector. –

0

creo que

$("body *").not("body #div2") 
      .not("body #div2 #elementtokeep") 
      .not("body #div2 #elementtokeep *") 
      .remove(); 

es la forma más fácil de enfocarla.

http://jsfiddle.net/6vb2va6g/

0

Este código trabajó para mí.

$('body > * :not(#123)').remove() 

Debes dejar espacio entre * y:. Antes, cuando intenta utilizar el código con

$('body > *:not(#123)').remove() no funcionó. Tuve que dar espacio entre * y: personaje.

Happy coding.

Cuestiones relacionadas