JavaScript - Objektreferenz
1. Vorwort
In diesem Kapitel dreht sich alles um die Übersicht der Objekte, die uns JavaScript von Hause aus mitliefert. Ihr bekommt hier allerdings
keinen kompletten Überblick, sondern nur eine gezielte Auswahl. Ich werde also zum Beispiel das frame-Objekt komplett
ignorieren, (da wir ja nicht mehr mit Frames arbeiten wollen), oder diese dämliche Statuszeile links unten im Browserfenster, die
eh keine Sau mehr interessiert. Ich übergehe auch alles, was ich im praktischen Einsatz bisher noch nie benutzt habe oder sich mit
HTML-Attributen beschäftigt, die das Aussehen beeinflussen. Eine vollständige Übersicht findet ihr bei
SelfHTML
2. Kompatibilität
Wann welcher Browser was wie versteht, könnt ihr an den kleinen Bildchen erkennen, die ich hinter allem Wichtigen platziere. Das sieht dann so aus:
Objekt, Methode, Eigenschaft
Dabei beziehe ich mich auf die aktuellen Versionen von Firefox, Opera, Safari und Chrome. Beim Internet Explorer beziehen sich die Angaben auf die Versionen 6 bis 8. Den 9ern klammer ich hier erst mal aus. Der soll zwar mittlerweile viel mehr können, aber das habe ich noch nicht ausgiebig getestet.
3. Die DOM-Elemente
Hier gibt es eine einfache Hierarchie, die ihr dem folgenden Diagramm entnehmen könnt. Das ist allerdings nur ein grober Überblick. Die Details dazu erfahrt ihr peu à peu.
4. Ein Hinweis
Anders als SelfHTML verzichte ich aus Platzgründen bei den folgenden Beispielen auf funktionsfähigen Code, da ich nur das Prinzip zeigen will. Wer es trotzdem testen möchte, muss die entsprechenden Anpassungen vornehmen. Außerdem schult das euern Verstand.
5. Zwei Besonderheiten
Die meisten Eigenschaften sind an bestimmte Objekte gebunden. Nur zwei machen eine Ausnahme, da man sie fast immer bei unterschiedlichsten Objekten nutzen kann.
length
Gibt eine Länge wieder. Dabei existieren einfach gesagt drei Möglichkeiten:
Strings
In diesem Fall wird die Anzahl der Zeichen zurückgegeben.
var zeichenkette = 'Blubb Blubber';
// gibt 13 zurück
alert (zeichenkette.length);
Objekte
Ermittelt die Anzahl von Elementen innerhalb eines Objektes.
<form name="blabla" action="irgendwas">
<input type="text" name="blubb">
<input type="text" name="bluber">
<textarea name="suelz">
kräh bla schwall
</textarea>
</form>
...
// gibt 3 zurück
alert (document.blabla.elements.length);
Selbst definierte Arrays
var dumdidum = new Array ('a','b','c','d');
// gibt 4 zurück
alert (dumdidum.length);
style
Hier kann man CSS-Anweisungen für HTML-Elemente auslesen und dynamisch zur Laufzeit ändern. Worauf ihr dabei achten müsst, habe ich euch ja schon hier gesagt.
document.body.style.color = '#f00;