molily: CSS3 *Target* IE workaround

Beitrag lesen

Hallo,

document.getElementsByClassName("test").style.color = "#FFFF00"; // gelb

getElementsByClassName gibt eine Liste von Elementen zurück, da viele Elemente dieselbe Klasse haben können.

Diese Liste selbst hat kein .style.color, sondern die einzelnen Elemente in der Liste. Daher sollte obige Code auch eine Fehlermeldung in der JavaScript-Konsole auslösen (vermutlich »TypeError: Cannot read property 'color' of undefined«). Man sollte immer auf der Fehlerkonsole nachschauen, wenn Code nicht wie gewünscht funktioniert. Die Developer-Tools mit der JavaScript-Konsole aktiviert man in den meisten Browsern mit der Taste F12.

Siehe auch JavaScript: Arbeitstechniken und Entwicklerwerkzeuge.

Listen kannst du z.B. mit einer konventionellen http://de.selfhtml.org/javascript/sprache/schleifen.htm@title=for-Schleife durchlaufen:

var elements = document.getElementsByClassName('test');  
for (var i = 0, l = elements.length; i < l; i++) {  
  var element = elements[i];  
  // Mach was mit element  
  element.style.color = 'red';  
}

Für die toggle-Variable eignet sich übrigens der Boolean-Typ mit den Werten true und false besser als eine Zahl.

Grüße
Mathias