Atributo textContent del HTML DOM

Objeto Elemento de HTML DOM

textContentAtributo que establece o devuelve el contenido de texto del nodo especificado y todos sus nodos hijos.

Establecer textContent en un nodo elimina todos los nodos hijos del nodo y los reemplaza con un solo nodo de texto que tiene el texto dado.

El atributo textContent es similar ainnerTextAtributo, pero hay algunas diferencias:

• textContent devuelvetodosel contenido de texto del elemento, mientras que innerText devuelveexcepto elementos <script> y <style>fuerade todos los elementos.

• innerText no devuelve el texto oculto en CSS (textContent lo devuelve)

Para establecer o devolver el contenido HTML del elemento, utiliceinnerHTMLAtributo.

Sintaxis:

Devuelve el contenido de texto del nodo:

node.textContent

Establecer el contenido de texto del nodo:

node.textContent = text

var x = document.getElementById("para").textContent;

Compatibilidad del navegador

Todos los navegadores admiten completamente el atributo textContent:

Valor del atributo

Detalles técnicos

Más ejemplos

Cambiar el contenido de texto del elemento <p> usando id="para":

var x = document.getElementById("para");
x.textContent = "HELLO WORLD";

Devuelve todo el contenido de texto del elemento DIV:

var x = document.getElementById("container").textContent;

Este ejemplo muestra la diferencia entre innerText, innerHTML y textContent:

<p id="x">Este elemento tiene un espacio adicional y contiene un <span>elemento span</span>.</p>
<script>
function getInnerText() {
alert(document.getElementById("x").innerText);
}
function getInnerHTML() {
alert(document.getElementById("x").innerHTML);
}
function getTextContent() {
alert(document.getElementById("x").textContent);
}
</script>

La propiedad innerText solo devuelve texto, sin espacios ni etiquetas internas de elementos.

La propiedad innerHTML devuelve el texto con espacios y etiquetas internas de elementos.

La propiedad textContent devuelve el texto con espaciado, pero sin etiquetas internas de elementos.

Referencias relacionadas

Referencia de HTML DOM:HTMLElementPropiedad .innerText

Referencia de HTML DOM:elementoPropiedad .innerHTML

Objeto Elemento de HTML DOM