JavaScript Beispiele: Eindeutigkeit
Bei der Programmierung mit JavaScript treten des öfteren Probleme mit der Benennung von Objekten, Eigenschaften und Variablen auf. Wie man damit umgeht, zeigen wir hier.Alle Objekte mit gleichem tagName
Ein Identifier ist an sich dazu gedacht, ein Objekt eindeutig zu bezeichnen. Doch dieses "eindeutig" ist leider nicht immer gegeben. Was kann man tun, wenn mehrere Objekte den selben Identifier tragen, oder gar keinen? Nun - man kann etwa mit der Methodetags() arbeiten.Mit
tags() kann man aus zahlreichen Kollektionen all jene Elemente herausgreifen, die einen bestimmten tagName aufweisen.- ob sie nun einen eindeutigen Identifier tragen, einen uneindeutigen Identifier oder gar keinen Identifier. Das ist besonders dann günstig, wenn man nicht von vornherein weiß, wie viele derartige Objekte es in einem "Container" geben wird. ("Container" ist der Programmierer-Jargon für alles, was eine gewisse Klasse von Objekten enthält.) Man weiß nur, dass ALLE Objekte im Container, die einen gewissen
tagName aufweisen, in der gleichen Weise behandelt werden sollen.Als Beispiel betrachten wir folgenden Code:
var coll = document.all.tags("P");
if (coll!=null)
{
for (i=0; i<coll.length; i++)
coll[i].style.textDecoration="underline";
}
coll all jene Objekte im Dokument herausgegriffen, die den tagName "P" aufweisen. (In diesem Beispiel ist also der "Container" einfach das ganze Dokument!) In den meisten Dokumenten werden das ziemlich viele sein - und wie greift man nun auf jedes einzelne davon zu?Sehr einfach - indem man
coll behandelt wie ein gewöhnliches Array, also durch Indizierung (coll[i]) Und Zugriff auf die einzelnen Attribute eines solchen Objekts hat man dann, wie gewohnt, durch Qualifizierung, mit einem Punkt (.) und dem Namen des gewünschten Attributs.Auf diese Weise kommen wir zu der - zunächst vielleicht verwirrenden - Zeile in der
for-Schleife:
coll[i].style.textDecoration="underline";
Für jene eingefleischten Programmierer unter uns, denen das noch längst nicht genügend abstrus ist - wer das möglichst kompakt programmieren will, der kann das natürlich auch so schreiben:document.all.tags("P")[i].style.textDecoration="underline";
Dadurch erspart man sich immerhin eine ganze Zeile Code, nämlich die Deklaration der Variablecoll
Beachten Sie die Feinheit, dass hier eine runde und eine eckige Klammer unmittelbar aufeinander folgen:
... .tags("P")[i]
Die Verwirrung wird noch größer, wenn man daran denkt, dass in einer anderen Methode beide Indizes innerhalb einer Klammer geschrieben werden:... .item("...",i) Doch davon mehr in der nächsten Folge.
Was macht man mit einem uneindeutigen Identifier?
Wenn man von einem Objekt nur einen Identifier weiß, bei dem man sich aber nicht darauf verlassen kann dass er eindeutig ist, wie kann man dann darauf zugreifen? - Mit der Methodeitem() geht auch das!Nehmen wir mal an, wir hätten folgende HTML-Konstruktion:
<DIV ID="div1">
<INPUT ID="t1" TYPE="Text" VALUE="uuu">
<INPUT ID="t2" TYPE="Text" VALUE="vvv">
</DIV>
<DIV ID="div2">
<INPUT ID="t1" TYPE="Text" VALUE="xxx">
<INPUT ID="t2" TYPE="Text" VALUE="yyy">
</DIV>
Sie könnten z.B. versuchen, das mit mehrfacher Qualifikation zu tun, etwa:
div1.t1.value = "aaa";
Doch leider, das kann JavaScript nicht. Da muss man das ein wenig umständlicher machen:div1.children.item('t1',0).value = "aaa";
children ist eine Collection aller Objekte im Inneren von div1 - in diesem Fall also die Text-Inputs t1 und t2. Fatalerweise aber ist es bei
item() nicht so, wie wir das bei tags() kennen gelernt haben, dass man diese Collection wie jedes gewöhnliche Array behandeln dürfte - also zum Beispiel:
var texts = div1.children.item('t1');
texts[0].value = "aaa";
//oder:
texts.item(0).value = "aaa";
//oder gar:
div1.children.item('t1')[0].value = "aaa";
Du arbeitest in einer Agentur oder als Freelancer?
Dann wirf doch mal einen Blick auf unsere Software FeatValue.
Über uns
Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project