react-web-tutorial/react-tuto/src/markdown/2. Manipuler le HTML/02. Récupérer un élément.md

On vient de voir la méthode document.getElementsByTagName(). D'autres méthodes semblables existent :

• document.getElementsByClassName() pour récupérer les éléments auxquels on a donné une certaine classe CSS via l'attribut class.
• document.getElementById() pour récupérer un élément par son attribut id.

Essaie ceci dans le document HTML :

<p id="paragraphe">Du texte et <span>encore du texte</span></p>
<script>
var paragraphe = document.getElementById('paragraphe');
console.log([paragraphe]);
</script>

Remarque : on crée un tableau avec l'élément récupéré car Chrome empêche de "déplier" un élément seul (pas nécessaire sous Firefox).

Examine ce qu'il y a sous children, mais également sous childNodes. Il y a une petite différence.

• children contient les noeuds correspondant à des balises HTML.
• childNodes contient les noeuds correspondant à des balises HTML et les noeuds de texte.

Ici, le noeud de texte situé directement sous la balise paragraphe contient "Du texte et " (visible dans la propriété data si tu déplies le 1er des childNodes).

Une balise peut contenir - ou pas - un ou des noeuds de texte. Une balise "auto-fermante" comme celle-ci n'en contient pas :

<img src="image.jpg" alt="Une image" />