Hund: DOM - document.getElementsByName()

Beitrag lesen

Hallo, ein kleines großes Problem mit dem DOM !

Hier zuerst das Problem - und unten die Beschreibung:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function farbe(nummer)
{
zellen = document.getElementsByName('zelle');
for (i = 0; i < zellen.length; i++)
{
zellen[i].className = "zelle1";
if (nummer == i)
zellen[i].className = "zelle2";
}
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<TABLE>
<TR>
<TD NAME="zelle" ID="zelle" CLASS="zelle1" onClick="farbe(0)"> </TD>
<TD NAME="zelle" ID="zelle" CLASS="zelle1" onClick="farbe(1)"> </TD>
<TD NAME="zelle" ID="zelle" CLASS="zelle1" onClick="farbe(2)"> </TD>
</TR>
</TABLE>
</BODY>
</HTML>

Drei Zellen einer Tabelle erhalten per CSS die Klasse "zelle1" als Vorgabewert zugewiesen. (z.B. Zellenhintergrund weiss)

Das JavaScript weisst nun der jeweils angeklickten Zelle die Klasse "zelle2" zu. (z.B. Zellenhintergrund farbig)
Alle anderen Zellen erhalten ihre vorgegebene Formatierung "zelle1". (z.B. Zellenhintergrund weiss)

Die Anzahl der Zellen habe ich mit

zellen = document.getElementsByName('zelle') ermittelt.

Damit müßte ich ja eigentlich das NAME-Attribut von <TD> ( hier "zelle" ) ansprechen.

Tatsächlich werden aber die ID 's von <TD> ermittelt:

ändere ich die NAME-Attribute, funktioniert das Script trotzdem, ändere ich die ID ' s, gehts nicht mehr.

Wo liegt der Hund begraben ?

Mfg Hund