HTML DOM childrenPropriété

元素对象参考手册Objet Element

Exemple

Obtenir la collection des éléments enfants de l'élément body :

var c = document.body.children;

Essayez-le vous-même »

Définition et utilisation

La propriété children renvoie une collection des éléments enfants d'un élément, qui est un objet HTMLCollection.

Astuce :Trié selon l'ordre dans lequel les éléments enfants apparaissent dans l'élément. Utilisez la propriété length de l'objet HTMLCollection pour obtenir le nombre d'éléments enfants, puis utilisez l'index (commençant à 0) pour accéder à chaque élément enfant.

La propriété children etchildNodesla différence entre les propriétés :

  • La propriété childNodes renvoie tous les nœuds, y compris les nœuds de texte et les nœuds de commentaire ;
  • La propriété children renvoie uniquement les nœuds d'élément ;

Prise en charge des navigateurs

Propriété
children 2.0 9.0* 3.5 4.0 10.0

Remarque : IE6 à IE8 prennent entièrement en charge la propriété children, mais elle renvoie les nœuds d'élément et les nœuds de commentaire ; IE9 et versions ultérieures ne renvoient que les nœuds d'élément.

Syntaxe

element.children

Détails techniques

Valeur de retour : Un objet HTMLCollection, représentant une collection de nœuds d'élément. L'ordre des éléments dans la collection est leur ordre dans le code source.
Version DOM DOM 1

Plus d’exemples

Exemple

Vérifiez combien d'éléments enfants un div possède :

var c = document.getElementById("myDIV").children.length;

Essayez-le vous-même »

Exemple

Modifier la couleur d'arrière-plan du deuxième élément enfant d'un élément div :

var c = document.getElementById("myDIV").children; c[1].style.backgroundColor = "yellow";

Essayez-le vous-même »

Exemple

Obtenir le texte du troisième (index 2) élément enfant dans un élément select :

var c = document.getElementById("mySelect").children; document.getElementById("demo").innerHTML = c[2].text;

Essayez-le vous-même »

Exemple

Modifier la couleur d'arrière-plan de tous les éléments enfants de l'élément body :

var c = document.body.children; var i; for (i = 0; i < c.length; i++) { c[i].style.backgroundColor = "red"; }

Essayez-le vous-même »

元素对象参考手册Objet Element

Autres extensions