Propiedad de texto interno HTML DOM
Ejemplo
Obtenga el texto interno de un elemento:
var x =
document.getElementById("myBtn").innerText;
Más ejemplos de "Pruébelo usted mismo" a continuación.
Definición y uso
La propiedad innerText establece o devuelve el contenido de texto del nodo especificado y todos sus descendientes .
Si establece la propiedad innerText, los nodos secundarios se eliminan y reemplazan por un solo nodo de texto que contiene la cadena especificada.
Nota: esta propiedad es similar a la propiedad textContent , sin embargo, existen algunas diferencias:
- textContent devuelve el contenido de texto de todos los elementos, mientras que innerText devuelve el contenido de todos los elementos, excepto los elementos <script> y <style>.
- innerText no devolverá el texto de los elementos que están ocultos con CSS (textContent lo hará).
Sugerencia: para establecer o devolver el contenido HTML de un elemento, use la propiedad innerHTML .
Compatibilidad con navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
Property | |||||
---|---|---|---|---|---|
innerText | 4.0 | 10.0 | 45.0 | 3.0 | 9.6 |
Sintaxis
Devuelve el contenido de texto de un nodo:
node.innerText
Establecer el contenido de texto de un nodo:
node.innerText = text
Valores de propiedad
Value | Type | Description |
---|---|---|
text | String | Specifies the text content of the specified node |
Detalles técnicos
Valor de retorno: | Una cadena, que representa el contenido de texto "renderizado" de un nodo y todos sus descendientes |
---|
Más ejemplos
Ejemplo
Este ejemplo demuestra algunas de las diferencias entre innerText, innerHTML y textContent:
<p id="demo"> This element has extra spacing and contains <span>a span
element</span>.</p>
<script>
function getInnerText() {
alert(document.getElementById("demo").innerText)
}
function getHTML()
{
alert(document.getElementById("demo").innerHTML)
}
function
getTextContent() {
alert(document.getElementById("demo").textContent)
}
</script>
Obtenga el contenido del elemento <p> anterior con las propiedades especificadas:
innerText devuelve: "Este elemento tiene espacio adicional y contiene un elemento de intervalo".
innerHTML devuelve: "Este elemento tiene espacio adicional y contiene <span>un elemento de intervalo</span>".
textContent devuelve: "Este elemento tiene espacio adicional y contiene un elemento de intervalo".
La propiedad innerText devuelve solo el texto, sin espaciado ni etiquetas de elementos internos.
La propiedad innerHTML devuelve el texto, incluidos todos los espacios y las etiquetas de elementos internos.
La propiedad textContent devuelve el texto con espaciado, pero sin etiquetas de elementos internos.