¿Cómo obtener el nodo de texto de un elemento?

Resuelto Val asked hace 13 años • 12 respuestas
<div class="title">
   I am text node
   <a class="edit">Edit</a>
</div>

Deseo obtener el nodo "Soy un nodo de texto", no deseo eliminar la etiqueta "editar" y necesito una solución para varios navegadores.

Val avatar Jun 29 '11 18:06 Val
Aceptado
var text = $(".title").contents().filter(function() {
  return this.nodeType == Node.TEXT_NODE;
}).text();

Esto obtiene el contentselemento seleccionado y le aplica una función de filtro. La función de filtro devuelve sólo nodos de texto (es decir, aquellos nodos con nodeType == Node.TEXT_NODE).

James Allardice avatar Jun 29 '2011 11:06 James Allardice

Puede obtener el valor de nodo del primer nodo secundario usando

$('.title')[0].childNodes[0].nodeValue

http://jsfiddle.net/TU4FB/

Dogbert avatar Jun 29 '2011 11:06 Dogbert

Otra solución JS nativa que puede resultar útil para elementos "complejos" o profundamente anidados es utilizar NodeIterator . Colóquelo NodeFilter.SHOW_TEXTcomo segundo argumento ("whatToShow") e itere solo sobre los nodos secundarios de texto del elemento.

var root = document.querySelector('p'),
    iter = document.createNodeIterator(root, NodeFilter.SHOW_TEXT),
    textnode;

// print all text nodes
while (textnode = iter.nextNode()) {
  console.log(textnode.textContent)
}
<p>
<br>some text<br>123
</p>
Expandir fragmento

También puedes usar TreeWalker. La diferencia entre los dos es que NodeIteratores un iterador lineal simple, mientras que TreeWalkertambién le permite navegar a través de hermanos y antepasados.

Yuval A. avatar Jan 10 '2016 00:01 Yuval A.

Versión ES6 que devuelve el contenido del primer nodo #text

const extract = (node) => {
  const text = [...node.childNodes].find(child => child.nodeType === Node.TEXT_NODE);
  return text && text.textContent.trim();
}
jujule avatar Dec 09 '2016 00:12 jujule