Los últimos tutoriales de desarrollo web
 

HTML DOM lastChild Propery

<Elemento de objeto

Ejemplo

Obtener el contenido HTML del último nodo hijo de un <ul> elemento:

var x = document.getElementById("myList").lastChild.innerHTML;

El resultado de x será:

Tea
Inténtalo tú mismo "

Más "Try it Yourself" ejemplos a continuación.


Definición y Uso

La propiedad lastChild devuelve el último nodo hijo del nodo especificado, como un objeto Node.

La diferencia entre esta propiedad y lastElementChild , es que lastChild devuelve el último nodo hijo como un nodo de elemento, un nodo de texto o un nodo de comentario (depending on which one's last) , mientras que lastElementChild devuelve el último nodo hijo como un nodo de elemento (ignores text and comment nodes) .

Nota: El espacio en blanco en el interior de elementos es considerado como texto, y el texto se considera como nodos (See "More Examples") .

Esta propiedad es de solo lectura.

Consejo: Utilice la .childNodes elemento propiedad para devolver cualquier nodo hijo de un nodo especificado.

Sugerencia: Para volver al primer nodo hijo de un nodo especificado, utilice el firstChild propiedad.


Soporte del navegador

Propiedad
lastChild

Sintaxis

node .lastChild

Detalles técnicos

Valor de retorno: Un objeto de nodo, que representa el último hijo de un nodo, o null si no hay nodos secundarios
Versión DOM Nivel básico de objetos 1 Nodo

Ejemplos

Más ejemplos

Ejemplo

En este ejemplo, se demuestra cómo los espacios en blanco puede interfare con esta propiedad.

Recibe el nombre de nodo del último nodo hijo de un <div> elemento:

<!--
Whitespace inside elements is considered as text, and text is considered as nodes
In this example, there is whitespace before <p>, before <span> and after <span>
Therefore, the last child node of <div> is a #text node, and not the <span> element you expected
-->

<div id="myDIV">
  <p>Looks like first child</p>
  <span>Looks like last Child</span>
</div>

<script>
var x = document.getElementById( "myDIV" ).lastChild.nodeName;
document.getElementById("demo").innerHTML = x;
</script>

El resultado de x será:

#text
Inténtalo tú mismo "

Ejemplo

Sin embargo, si eliminamos el espacio en blanco de la fuente, no hay ningún nodo en #text <div>, que hará que el <span> elemento del último nodo hijo:

<div id="myDIV"><p>First child</p><span>Last Child</span></div>

<script>
var x = document.getElementById( "myDIV" ).lastChild.nodeName;
document.getElementById("demo").innerHTML = x;
</script>

El resultado de x será:

SPAN
Inténtalo tú mismo "

Ejemplo

Obtener el texto del último nodo hijo de un <select> elemento:

var x = document.getElementById("mySelect").lastChild.text;

El resultado de x será:

Volvo
Inténtalo tú mismo "

Páginas relacionadas

Referencia HTML DOM: nodo. firstChild propiedad

Referencia HTML DOM: nodo. childNodes propiedad

Referencia HTML DOM: nodo. parentNode propiedad

Referencia HTML DOM: nodo. nextSibling propiedad

Referencia HTML DOM: nodo. previousSibling propiedad

Referencia HTML DOM: nodo. nombreNodo propiedad


<Elemento de objeto