Style von Listenelementen beliebiger Anzahl ändern

[Buddy5]

Hallo Leute ich bins nochmal,

ich habe noch folgendes Problem. Ich möchte in einer Liste den Style ändern. also steht z.B.:

1. Hallo // Text ist in Rot
   2. Hallo // Text ist in Blau
   3. Hallo // Text ist in Gelb

Nun möchte ich die Farben also umdrehen. Es soll also folgendes stehen:

1. Hallo // Text ist in Gelb
   2. Hallo // Text ist in Blau
   3. Hallo // Text ist in Rot

Ich möchte das auf beliebig viele Listenelemente machen, deswegen ist mein Problem die Schleife hinzukreigen. Ich wollte in ein Array die styles speichern, also z.B. "style="color:blue"" und dann wieder umgekehrt als Listenatribut setzen.

Aber wie komm ich an die Atribute ran. Ich wollte folgendes als Schleife realisieren:

StyleArray[i] = document.getElementsByTagName("li")[i].getAttribute();

und dann halt wieder:

StyleArray[i] = document.getElementsByTagName("li")[i].setAttribute()

ich glaube ich muss zwei Arrays benutzen oder. Einmal für die Listenelemente und einmal für die Styles sleber oder?

Ich würde mich auf eine Antwort freuen.

Gruß,
Bud

[Bla]

1. Hallo // Text ist in Rot
   2. Hallo // Text ist in Blau
   3. Hallo // Text ist in Gelb

Nun möchte ich die Farben also umdrehen. Es soll also folgendes stehen:

1. Hallo // Text ist in Gelb
   2. Hallo // Text ist in Blau
   3. Hallo // Text ist in Rot

Ich möchte das auf beliebig viele Listenelemente machen, deswegen ist mein Problem die Schleife hinzukreigen.

Du musst lediglich den Stil des ersten mit dem des letzten Elements vertauschen, anschließend jenen des ersten+1 mit jenem des letzten-1 und so weiter, bis du in der Mitte, d.h. beim ersten+(anzahl/2) ankommst.
Das könnte ungefähr so aussehen:

var elemente = [ein Feld mit Elementen, zB aus getElementsByTagName]
var n = elemente.length - 1;
var s;

for (var i = 0; i < Math.floor(n / 2); i++) {
    s = elemente[i].style.color;
    elemente[i].style.color = elemente[n-i].style.color;
    elemente[n-i].style.color = s;
}

Fehler gibt's gratis dazu. Beachte, dass getElementsByTagName() auf das gesamte Dokument wirkt. Vielleicht möchtest du lieber mit getElementById() die betreffende Liste abgreifen und dann mit childNodes (im Browser eingebaut) oder immediateDescendants (aus der prototype-Bibliothek) arbeiten.

Aber wie komm ich an die Atribute ran.

Enweder so

document.getElementsByTagName("li")[i].getAttribute()

oder so

document.getElementsByTagName("li")[i].style.color

oder möglicherweise auch lieber mit getStyle(), denn die ersten beiden liefern nicht unbedingt das gewünschte Ergebnis.

[wahsaga]

hi,

Beachte, dass getElementsByTagName() auf das gesamte Dokument wirkt.

Nur, wenn du es als Methode von document aufrufst.
Du kannst es aber auch als Methode eines HTML-Elementobjektes aufrufen.

gruß,
wahsaga

[Buddy5]

Danke Bla,

ich habs hinbekommen. Das was ich nicht gefunden habe war:

document.getElementsByTagName("li")[i].style.color

damit kann ich den Stil natürlich direkt rausfischen. Habe ich auch nicht auf SelfHTML gefunden.

Danke nochmal für eure Antworten

Gruß,
Bud

[Buddy5]

Danke für die Antworten. Ich werde es ausprobieren.

MfG

Bud