Sujet Précédent Sujet Suivant

GetElementsByClassName()

Fermé
flycon Messages postés 5 Date d'inscription dimanche 28 novembre 2010 Statut Membre Dernière intervention 27 novembre 2013 - Modifié par flycon le 27/11/2013 à 13:35
ElementW Messages postés 4816 Date d'inscription dimanche 12 juin 2011 Statut Contributeur Dernière intervention 5 octobre 2021 - 27 nov. 2013 à 14:22
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 4816 Date d'inscription dimanche 12 juin 2011 Statut Contributeur Dernière intervention 5 octobre 2021 1 228
27 nov. 2013 à 14:22
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