Dom CORE : Objet Node->childNodes

La propriété javascript childNodes

Définition

L'attribut javascript childNodes de l'objet Node permet de récupérer tous les noeuds enfants du noeud.
Exemple de code :
var enfant = ObjetNode.childNodes;
Descendre
Remonte

Valeur retournée de childNodes

Valeur retournée

L'attribut javascript childNodes de l'objet Node renvoie un objet NodeList.
Descendre
Remonte

Exemple de childNodes

Code

Prenons comme exemple le code suivant :
Exemple de code :
<p id="idChildNodes">Comment utiliser <b>childNodes</b> de l'objet <b>Node</b></p>
<script type="text/javascript">
<!--
var noeud = document.getElementById("idChildNodes")
var fils = noeud.childNodes;
var nbFils = fils.length;
for(var i = 0; i < nbFils; i++){
  document.write(fils[i].nodeType +"/"+ fils[i].nodeValue +"<br>");
}
/*
Ecrit :
3/Comment utiliser
1/ null
3/ de l'objet
1/ null
*/
//-->
</script>
Descendre
Remonte

Expliquation

On recupère le noeud dans une variable javascript "noeud" avec la méthode document.getElementById("idChildNodes").
Nous récupérons le tableau des noeud fils (NodeList) dans une variable javascript "fils" grâce à l'attribut childNodes.
Nous pouvons connaître le nombre de fils grâce l'attribut javascript length.
Nous affichons la valeur de chaque noeud fils.

Pourquoi avons nous des null ?
Regardez le type du noeud, il est de type Objet Element (<b>childNodes</b> et <b>Node</b>) alors que les autre sont de type Objet Text.
Il faut dont récupérer les fils du noeud 1 et 3, pour pouvoir afficher leur valeur grâce à l'attribut childNodes.
Le code est donc par exemple :
Exemple de code :
for(var i = 0; i < nbFils; i++){
  if(fils[i].nodeType==1){
    document.write(fils[i].nodeType +"/"+ fils[i].childNodes[0].nodeValue +"<br>");
  }else{
    document.write(fils[i].nodeType +"/"+ fils[i].nodeValue +"<br>");
  }
}
/*
Ecrit :
3/Comment utiliser
1/childNodes
3/ de l'objet
1/Node
*/
Descendre
Remonte