¿Cómo eliminar texto (sin quitar elementos internos) de un elemento padre usando jQuery

Question

Imagínese que tengo algo como lo siguiente (modificado de http://viralpatel.net/blogs/jquery-get-text-element-without-child-element/)

<div id="foo"> 
    first 
    <div id="bar1"> 
     jumps over a lazy dog! 
    </div> 
    second 
    <div id="bar2"> 
     another jumps over a lazy dog! 
    </div> 
    third 
</div> 

¿Cómo puedo eliminar sólo (sólo texto) "primera "," segundo "y" tercero "de DOM sin afectar a ninguno de los elementos secundarios.

Answer 1

Si desea eliminar todos los nodos de texto niño que puede utilizar .contents() y luego .filter() para reducir el conjunto combinado de sólo los nodos de texto:

$("#foo").contents().filter(function() { 
    return this.nodeType === 3; 
}).remove();​​​​​​​ 

Aquí hay un working example.

Nota: Esto conservará cualquier controlador de eventos existentes en los elementos secundarios, que responde utilizando .html() no va a hacer (ya que los elementos se eliminan de la DOM y añaden de nuevo).

Nota 2: Respuestas en algunas de las cuestiones vinculadas muestran un código similar al que en mi respuesta aquí, sino que utilizan los nodeType constantes (por ejemplo return this.nodeType === Node.TEXT_NODE). Esta es una mala práctica ya que IE debajo de la versión 9 no implementa la propiedad Node. Es más seguro usar los enteros (que se pueden encontrar en el DOM level 2 spec).

Answer 2

probar esto:

$("#foo").html($("#foo").find("div"));​ 

demo: http://jsfiddle.net/PXxC4/

Answer 3

Puede usar esto.

$("#foo").html($("#foo").children());​ 

Answer 4

Aquí es una versión no jQuery que funciona en todos los navegadores de nuevo a IE 5, sólo para demostrar cómo unscary vida sin jQuery es.

Demostración: http://jsfiddle.net/timdown/aHW9J/

Código:

var el = document.getElementById("foo"), child = el.firstChild, nextChild; 

while (child) { 
    nextChild = child.nextSibling; 
    if (child.nodeType == 3) { 
     el.removeChild(child); 
    } 
    child = nextChild; 
}