react-web-tutorial/react-tuto/src/markdown/2. L'API DOM/03. Trouver un élément.md

On a vu comment parcourir l'arbre du document, en "descendant", via les propriétés children.

Mais utiliser les children pour trouver les éléments à partir de l'objet document ne serait pas pratique ! Remplace le contenu du body par illustrer ça :

<p>Un paragraphe</p>
<script>
var paragraphe = document
  .children[0] // récupère l'élément html
  .children[1] // récupère le body
  .children[0] // récupère le paragraphe
console.dir(paragraphe);
</script>

Le résultat est celui attendu, mais c'est bien compliqué, de plus ça implique qu'on sache précisément où se trouve le paragraphe dans le body ! Et si on a l'idée d'ajouter un élément avant le paragraphe, ça ne marche plus !

Heureusement, l'API DOM fournit des fonctions pour localiser des éléments dans le document. Voici la plus simple :

<p id="paragraphe">Star Wars VIII divise les fans !</p>
<script>
var paragraphe = document.getElementById('paragraphe');
console.dir(paragraphe);
</script>

La méthode getElementById() appelée sur document retrouve l'élément avec l'attribut id spécifié.