Recorriendo la estructura jerárquica del DOM

by Fabian Allel

HTML

<div id="envuelve">
    <div id="uno">
    
    </div>
    <div id="dos">
        
    </div>
</div>

JavaScript

//acceder al body
console.log(document.body);
//acceder a todo el html
console.log(document.documentElement);


//acceder a los nodos hijos de un elemento
console.log(document.body.childNodes[1].childNodes);
//el primer nodo hijo del actual
console.log(document.body.childNodes[1].firstChild);

//el último nodo hijo del actual
console.log(document.body.childNodes[1].lastChild);

//acceder al nodo siguiente
console.log(document.body.childNodes[0].nextSibling);

//acceder al nodo anterior
console.log(document.body.childNodes[2].previousSibling);