8 - Otras formas de acceder a los nodos hijos (firstChild y lastChild - firstElementChild y lastElementChild)



Problema:Definir un div con tres párrafos. Obtener la referencia del último hijo del div. Regresar desde el final con la propiedad previousElementSibling. Mostrar el contenido de cada párrafo.
<!DOCTYPE html>
<html lang="es">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Prueba</title>
</head>

<body>
    <div id="parrafos">
        <p>Este es el primer párrafo</p>
        <p>Este es el segundo párrafo</p>
        <p>Este es el tercer párrafo</p>
    </div>
    <input type="button" value="accediendo a los tres párrafos" onClick="parrafoAnterior()">
    <script src="funciones.js"></script>
</body>

</html>
function parrafoAnterior() {
    let puntero1 = document.getElementById('parrafos')
    let puntero2 = puntero1.lastElementChild
    while (puntero2 != null) {
        alert(puntero2.childNodes[0].nodeValue)
        puntero2 = puntero2.previousElementSibling
    }
}
Ver solución


Retornar