02. Eléments et noeuds texte.md 2.6 KB
L'objet document contient de nombreuses propriétés, mais pour l'instant on s'occupe de :
children, pour laquelle est indiquée le typeHTMLCollection: elle contient les descendants directs dedocument: ici, un seul élement, créé via la balise<html>.childNodes, similaire mais subtilement différente.
Pour détailler cette différence, déplie children, puis la clé 0 sur laquelle se trouve html.
On trouve à nouveau children et childNodes, ce qui confirme la notion d'arborescence.
Examine-les attentivement.
Ils contiennent presque la même chose : les deux ont en commun head et body qui correspondent aux balises de même nom.
Mais childNodes contient, entre head et body, un noeud text.
Déplie le et regarde sa propriété data : une chaîne de 3 caractères : le symbole du retour chariot,
suivi de deux espaces. Si tu regardes dans empty.html, ça correspond exactement à ce qui se trouve après
la balise fermante </head> et avant la balise ouvrante <body>. Ça nous amène à l'explication...
On distingue deux types de noeuds dans l'arbre du document :Donc,
- Des éléments, qui correspondent aux balises.
- Des noeuds texte, qui sont du contenu textuel situé entre deux balises, ou à l'intérieur d'une balise.
childrencontient seulement les éléments enfants, alors quechildNodescontient en plus les noeuds textes.
Remarque : certains éléments ne peuvent pas avoir de descendants ! C'est le cas par exemple de <br> (saut de ligne),
et de <img src="" /> qui est une balise "auto-fermante".