Klassen selektieren in JavaScript

[molily]

Hallo,

also will ich beispielsweise nicht die CSS-Angaben von allen "p"-Objekten ändern, sondern nur von solchen, die das Attribut class="beispiel" aufweisen

Such mal nach getElementsByClassName - das ist eine Helferfunktion, die die fraglichen Elemente durchgeht und einfach über className prüft, ob sie in Frage kommen.

Zum Ändern von CSS-Angaben wird hier wenn ich richtig gelesen habe einfach empfohlen, entweder "GetElementsByTagName", "GetElementsById" oder "GetElementsByName" zusammen mit dem style-Objekt zu verwenden. Das gibt mir aber doch noch keine Möglichkeit an die Hand, nur Elemente einer bestimmten Klasse zu ändern, oder?

Für sich genommen nicht, du kannst aber beim Durchlaufen des Rückgabewerts wie gesagt filtern.

for (var i = 0; i < document.getElementsByTagName("p").length; i++) {
    document.getElementsByTagName("p")[i].style.border = "solid red 10px";
    document.getElementsByTagName("p")[i].style.backgroundColor = "#FF9933";
    document.getElementsByTagName("p")[i].style.color = "#FFFFFF";
    document.getElementsByTagName("p")[i].style.fontSize = "250%";

Kleiner Hinweis zur Performance: Das sollte man so nicht notieren, weil es sehr langsam läuft, da document.getElementsByTagName("p") immer wieder aufgerufen wird und .length ständig abgefragt wird, was unnötig ist. Besser wäre wohl:

for (
  var i = 0, list = document.getElementsByTagName("p"), element;
  element = list[i];
  i++
) {
   element.style.border = "1px solid red";
   usw.
}

for (var i = 0; i < document.getElementsByTagName("img").length; i++) {
    document.getElementsByTagName("img")[i].style.border = "solid red 1px";

dann werden ALLE HTML-Elemente auf dem Bildschirm mit einem derart spezifizierten Rahmen ausgestattet.

Das kann nicht sein.

Mathias