Enfants DOM

Regardez cette page :

          <html>
<body>
  <div>Users:</div>
  <ul>
    <li>John</li>
    <li>Pete</li>
  </ul>
</body>
</html>
        

Pour chacun des éléments suivants, donnez au moins un moyen d’y accéder :

Le noeud <div> du DOM ?
Le noeud <ul> du DOM ?
Le deuxième <li> (avec Pete) ?

Il existe de nombreuses façons, par exemple :

Le noeud <div> du DOM :

          document.body.firstElementChild
// ou
document.body.children[0]
// ou (le premier nœud est l'espace, nous prenons donc le deuxième)
document.body.childNodes[1]
        

Le nœud <ul> du DOM :

          document.body.lastElementChild
// ou
document.body.children[1]
        

Le deuxième <li> (avec Pete) :

          // obtenir <ul>, puis obtenir son dernier élément enfant
document.body.lastElementChild.lastElementChild
        