GetElementsByClassName()

flycon Messages postés 5 Date d'inscription   Statut Membre Dernière intervention   -  
ElementW Messages postés 4814 Date d'inscription   Statut Contributeur Dernière intervention   -
Bonjour,

À titre de webmestre autodidacte (3.5 ans) d'une jeune entreprise de conception de sites Web, je désirais partager un certain script que j'ai préparé pour l'un de nos modèles : celui de pouvoir modifier l'ambiance d'un site selon l'heure de la journée.

Du coup, je laisse à ceux qui pourront m'aider de m'expliquer pourquoi le getElementsByClassName() ne fonctionne pas, comme vous pourrez le voir dans le fichier bg_changing_by_hours.js.

J'ai essayé les 3 codes suivants :

document.getElementsByClassName("whitefont").style.color = "#FFF";

document.getElementsByClassName("maincontent,whitefont").style.color = "#FFF";

document.getElementById("maincontent").getElementsByClassName("whitefont").style.color = "#FFF";

Merci d'avance pour votre aide.

1 réponse

Réponse 1 / 1
ElementW Messages postés 4814 Date d'inscription   Statut Contributeur Dernière intervention   1 223
 
Salut, ça ne marche pas car getElementsByClassName renvoie une HTMLCollection (bah oui c'est "getElements"), soit un tableau d'éléments HTML, et on ne peut pas changer leur propriété d'un coup (nan, ça serait trop facile mais surtout ambigu et potentiellement bourré d'erreurs, par exemple 
<a>
a le tag 
href
mais pas 
<p>
or les 2 peuvent avoir la même classe).
Du coup faut utiliser une boucle, et magie pour faire le défilement dans le tableau à notre place, on a for...in: 
for (var elem in document.getElementsByClassName("whitefont")) {
    elem.style.color = "#FFF";
}
for (var elem in document.getElementsByClassName("maincontent,whitefont")) {
    elem.style.color = "#FFF";
}
for (var elem in document.getElementById("maincontent").getElementsByClassName("whitefont")) {
    elem.style.color = "#FFF";
}
0