So, das waren jetzt ein Stündlein Arbeit, aber auch nur weil ich davon bisher wenig Ahnung hatte - über das DOM dazuzulernen schadet nie
Hier ein einfaches generelles Script zum:
* ändern der Klasse aller Tags X von Y zu Z und zurück (also zB bei alle Tabellenzeilen
die die Klasse 'sichtbar' haben, wird sie zu 'unsichtbar' geändert)
* ändern des Texts des Änderungslinks je nach aktuellem Status (der Link soll nachher
"ausblenden" heißen, nicht mehr "einblenden")
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16: |
function aendern(welchertag, class1, class2, linkgeklickt, linknormal, thus) {
var rows = document.getElementsByTagName(welchertag);
for(var i=0; i<rows.length; i++) {
if (rows[i].className==class1) {
rows[i].className=class2;
thus.innerHTML = linkgeklickt;
} else {
if (rows[i].className==class2) {
rows[i].className=class1;
thus.innerHTML = linknormal;
}
}
}
}
|
Aufgerufen wirds so:
1:
2:
3: |
<a href="#" onclick="aendern('tagname', 'alteklasse', 'neueklasse', 'neuerlink', 'alterlink', this)">
|
wobei
tagname = Tag, dessen Attribute geändert werden sollen, zB
tr
alteklasse = jetzige, zu ersetzende Klasse, zB
sichtbar
neueklasse = neue Klasse, zb
unsichtbar
neuerlink = wie der Link dann heißen soll, zB
wieder einblenden
alterlink = wie der Link jetzt heißt, zB
ausblenden
this = genau so lassen, keine Anführungszeichen drum!
Beispiel:
http://c3o.org/test/dom/changeclass.html
Anmerkung:
Läuft natürlich nur auf DOM-kompatiblen, aktuellen Browsern. Getestet auf IE5/win, als Dokumentation das Mozilla-Manual verwendet, also IE5+ und Moz/N6+ sollten keine Probleme haben.
N4 kannst vergessen.
[ Diese Nachricht wurde geändert von: c3o am 2002-09-07 10:54 ]