document |
|
document: Allgemeines zur Verwendung Eigenschaften:
alinkColor (Farbe für Verweise beim Anklicken) Methoden:
captureEvents() (Ereignisse überwachen) Unterobjekte: |
|
Das document-Objekt bezieht sich auf den Inhalt, der in einem Browser-Fenster angezeigt wird. In der Objekthierarchie von JavaScript liegt es unterhalb des window-Objekts. Das document-Objekt enthält eine Reihe eigener Eigenschaften und Methoden. Das Ansprechen dieser Eigenschaften und Methoden funktioniert wie folgt:
x = document.title; x = window.document.title; Zweitfenster = window.open("datei2.htm", "Fenster"); x = Zweitfenster.document.title; y = parent.frames[2].document.bgColor; document.write("Hallo Welt"); window.document.write("Hallo Welt"); Zweitfenster.document.close(); parent.frames[2].document.close(); |
Eigenschaften des document-Objekts, wie etwa der Titel der angezeigten HTML-Datei (<title>...</title>), können Sie mit document ansprechen, den Titel der Datei also document.title. Entsprechend werden Methoden des document-Objekts angesprochen, zum Beispiel die write-Methode mit document.write(). Sie können auch window.document.title oder window.document.write() notieren. Da es sich dabei aber um den Inhalt des aktuellen Fensters handelt, ist die Angabe des Fensternamens nicht zwingend erforderlich. Anders beim Zugriff auf andere Fenster oder Frame-Fenster. In diesen Fällen müssen Sie das Fenster korrekt adressieren. Lesen Sie für zusätzliche Fenster den Abschnitt zur Verwendung des window-Objekts und für Frame-Fenster den Abschnitt über die Verwendung des frames-Objekts.
Speichert die Farbe für Verweise, während sie angeklickt werden, wie beim Attribut alink= im <body>-Tag oder vom Anwender in seinen Browser-Einstellungen festlegbar ist (siehe auch Farbe für Text und Verweise).
<html><head><title>Test</title> <script language="JavaScript"> var i = 0; function AndereFarbe() { if(i == 0) document.alinkColor = "000000"; else if(i == 1) document.alinkColor = "FF0000"; else if(i == 2) document.alinkColor = "0000FF"; else if(i == 3) document.alinkColor = "green"; i = i + 1; if(i > 3) i = 0; } </script> </head><body> <a href="javascript:AndereFarbe()">Verweisfarbe</a> </body></html> |
Das Beispiel ruft beim Anklicken des Verweises eine Funktion namens AndereFarbe() auf. Diese Funktion ändert bei jedem ihrer Aufrufe den Wert für document.alinkColor. Beachten Sie, daß Farben dabei entweder hexadezimal notiert werden, jedoch ohne Gatterzeichen (#) davor wie in HTML, oder in Form erlaubter Farbnamen (siehe auch Farben definieren in HTML). Der Wert muß in jedem Fall in Anführungszeichen stehen.
Speichert die Hintergrundfarbe der HTML-Datei, wie sie beim Attribut bgcolor= im <body>-Tag oder vom Anwender in seinen Browser-Einstellungen festlegbar ist. (siehe auch Farbe für Hintergrund).
<html><head><title>Test</title> <script language="JavaScript"> var X = new Array("0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F"); var x1 = 0, x2 = 0; for(i = 0; i < 255; ++i) { document.bgColor = X[x1] + X[x2] + X[x1] + X[x2] + X[x1] + X[x2]; x2 = x2 + 1; if(x2 % 16 == 0) { x2 = 0; x1 = x1 + 1; } } </script> </head><body> </body></html> |
Das Beispiel blendet beim Einlesen die Hintergrundfarbe von Schwarz über Graustufen nach Weiß auf. Dazu wird ein Array X definiert, in dem die Hexadezimalziffern 0 bis 9 und A bis F gespeichert werden. In einer for-Schleife wird von 0 bis 255 gezählt. Der Grund ist, daß 255 der maximale Wert (dezimal gesehen) eines RGB-Farbwerts sein kann. Innerhalb der Schleife wird der Eigenschaft document.bgColor jeweils ein neuer Wert zugewiesen. Dabei wird aus den zuvor definierten Ziffern das Arrays X eine gültige Farbangabe konstruiert.
Beachten Sie, daß Farben entweder hexadezimal notiert werden, jedoch ohne Gatterzeichen (#) davor wie in HTML, oder in Form erlaubter Farbnamen (siehe auch Farben definieren in HTML). Der Wert muß in jedem Fall in Anführungszeichen stehen. Im obigen Beispiel tut er das nicht, weil es sich um eine Zeichenkette handelt, die dynamisch konstruiert wird. Fixe Angaben wären beispielsweise "0099CC" oder "blue".
Speichert den definierten Zeichensatz eines Dokuments.
<html><head><title>Test</title> <meta http-equiv="content-type" content="text/html;CHARSET=iso-8859-1"> <script language="JavaScript"> function iso5() { document.charset="iso-8859-5"; document.open(); document.write("Text mit ä ö ü"); document.close(); } </script> </head><body> <a href="javascript:iso5()">iso-8859-5</a> </body></html> |
Das Beispiel enthält im Dateikopf eine Angabe zur Definition des Zeichensatzes. Dort wird iso-8859-1 definiert (der Standard-Zeichensatz für westliche Sprachen, inklusive der deutschen). Ferner enthält die Datei einen Verweis. Beim Anklicken wird die Funktion iso5() aufgerufen. Diese Funktion ändert den Zeichensatz auf iso-8859-5 (Kyrillisch). Anschließend werden dynamisch Inhalte in das Dokumentfenster geschrieben. Der MS Internet Explorer schreibt den angegebenen Text in das Dokumentfenster, schaltet dabei jedoch auf eine spezielle Unicode-Schriftart zur Darstellung um.
Beachten Sie, daß zum Schreiben des neuen Inhalts die Methoden
open() und
close() verwendet werden.
Cookies (cookies = Kekse - die Herkunft des Namens ist unbekannt) bieten Ihnen die Möglichkeit, direkt aus einer HTML-Datei heraus Daten auf dem Rechner des Anwenders zu speichern und beim erneuten Aufruf der gleichen HTML-Datei wieder auszulesen. So kann eine WWW-Seite dynamisch auf gespeicherte Daten reagieren. Es ist nur möglich, diejenigen Cookies auszulesen, die man selbst gesetzt hat. Eine Virenübertragung mit Cookies ist ausgeschlossen. Ein Cookie ist in etwa das gleiche wie ein Eintrag in einer INI-Datei unter MS-Windows. Es wird eine Variable mit einem zugewiesenen Wert abgespeichert, zum Beispiel Datum und Uhrzeit des letzten Besuchs der WWW-Seite. Es können keine Rechnerdaten des Anwenders ausgelesen werden. Angesichts des vorherrschenden Mißtrauens bei Anwendern, die nicht wissen, was ein Cookie ist, sollten Sie Cookies nur verwenden, wenn Sie einen Grund dazu haben.
Netscape verwaltet Cookies in einer Datei namens COOKIES.TXT auf dem Rechner des Anwenders. Der MS Internet Explorer verwaltet die Cookies in einem Unterverzeichnis des Windows-Verzeichnisses. Beim MS Internet Explorer funktionieren Cookies nur, wenn die HTML-Datei über das HTTP-Protokoll in den Browser geladen wird.
<html><head><title>Test</title> <script language="JavaScript"> var gespeichert = "nichts gespeichert"; if(document.cookie) gespeichert = document.cookie; else document.cookie = "Zeitstempel=" + document.lastModified; alert(document.lastModified + " - " + gespeichert); </script> </head><body> </body></html> |
Das Lesen eines Cookies funktioniert nach dem Schema x = document.cookie.
Das Schreiben eines Cookies funktioniert nach dem Schema document.cookie = x.
Das Beispiel frägt beim Einlesen der Datei ab, ob diese Datei schon einmal einen Cookie gesetzt hat. Eine solche Abfrage ist mit if(document.cookie) möglich. Im Beispiel wird die Variable gespeichert mit dem Wert des gespeicherten Cookies versorgt, falls ein Cookie vorhanden ist. Im else-Zweig des Beispiels steht der Fall, daß noch kein Cookie gesetzt wurde. In diesem Fall wird als Cookie die Zeichenkette Zeitstempel= und dahinter der Wert von lastModified geschrieben. also Am Ende werden mit alert() zwei Werte ausgegeben: nämlich der Wert von document.lastModified und der Wert der Variablen gespeichert. Wenn ein Cookie gesetzt ist (also ab dem zweiten Aufruf der Datei), wird der Inhalt des Cookies ausgegeben, der sich von document.lastModified dann unterscheidet, wenn die Datei mittlerweile geändert wurde.
Beim Setzen eines Cookies können Sie außerdem einen Verfallszeitpunkt angeben. Wenn der Verfallszeitpunkt erreicht ist, löscht der Browser den Cookie selbständig. Notieren Sie dazu eine Anweisung wie:
document.cookie += "expires=" + cookieDate(time + 1000*60*60*24*5)
Damit wird der Cookie um einen Eintrag der Form expires= erweitert. Eine spezielle Funktion cookieDate() erlaubt es, einen Verfallszeitpunkt zu setzen. Übergeben Sie der Funktion als Parameter am besten time (der aktuelle Zeitpunkt) plus die Anzahl Millisekunden ab dem aktuellen Zeitpunkt, nach denen der Cookie gelöscht werden soll. Dazu können Sie wie im Beispiel eine Multiplikationskette übergeben: 1000 Millisekunden sind eine Sekunde, mal 60 macht eine Minute, mal 60 macht eine Stunde, mal 24 ein Tag, und mal 5 macht fünf Tage.
Speichert den Zeichensatz, den der Anwender als Standard im Browser eingestellt hat. Wenn die Datei keine Meta-Angabe zum verwendeten Zeichensatz enthält, wird der Standard-Zeichensatz angenommen.
<html><head><title>Test</title> <script language="JavaScript"> alert("Sie haben als Zeichensatz eingestellt: " + document.defaultCharset); </script> </head><body> </body></html> |
Das Beispiel gibt beim Einlesen der Datei mit alert() aus, welchen Zeichensatz der Anwender als Standardzeichensatz eingestellt hat.
Speichert die Farbe für Text, wie beim Attribut text= im <body>-Tag oder vom Anwender in seinen Browser-Einstellungen festlegbar (siehe auch Farbe für Text und Verweise).
<html><head><title>Test</title> <script language="JavaScript"> if(parent.frames[0].document.fgColor == "000000") document.fgColor = "FF0000"; </script> </head><body> </body></html> |
Das Beispiel nimmt an, daß sich die aktuelle Datei innerhalb eines Frame-Sets befindet. Beim Einlesen der Datei wird geprüft, ob die Textfarbe eines anderen (des ersten) Frame-Fensters schwarz ist (if(parent.frames[0].document.fgColor == "000000")). Wenn dies der Fall ist, wird die Textfarbe der aktuellen Datei auf rot gesetzt (document.fgColor = "FF0000";). Beachten Sie, daß Farbänderungen für die Textfarbe nur Wirkung haben, bevor irgendwelcher HTML-Text eingelesen wurde. Beachten Sie bei den Farbangaben, daß Farben entweder hexadezimal notiert werden, jedoch ohne Gatterzeichen (#) davor wie in HTML, oder in Form erlaubter Farbnamen (siehe auch Farben definieren in HTML). Der Wert muß in jedem Fall in Anführungszeichen stehen.
Speichert Datum und Uhrzeit der letzten Änderung der Datei, und zwar im internationalen Format nach GMT (Greenwhich-Zeit).
<html><head><title>Test</title> </head><body> <script language="JavaScript"> document.write("letzter Update: " + document.lastModified); </script> </body></html> |
Das Beispiel schreibt mit der Methode write() den Zeitpunkt der letzten Änderung dynamisch in die HTML-Datei.
Speichert die Farbe für Verweise, wie beim Attribut link= im <body>-Tag oder vom Anwender in seinen Browser-Einstellungen festlegbar (siehe auch Farbe für Text und Verweise).
<html><head><title>Test</title> <script language="JavaScript"> document.linkColor = parent.frames[0].document.linkColor; </script> </head><body> </body></html> |
Das Beispiel nimmt an, daß sich die aktuelle Datei innerhalb eines Frame-Sets befindet. Beim Einlesen der Datei wird die Verweisfarbe der aktuellen Datei auf die gleiche Farbe gesetzt wie die Verweisfarbe der Datei, die sich in einem anderen (dem ersten) Frame-Fenster befindet.
Beachten Sie, daß Farbänderungen für die Verweisfarbe nur Wirkung haben, bevor irgendwelcher HTML-Text eingelesen wurde. Beachten Sie bei den Farbangaben, daß Farben entweder hexadezimal notiert werden, jedoch ohne Gatterzeichen (#) davor wie in HTML, oder in Form erlaubter Farbnamen (siehe auch Farben definieren in HTML). Der Wert muß in jedem Fall in Anführungszeichen stehen.
Speichert die URL-Adresse, von der aus die aktuelle Datei aufgerufen wurde. Voraussetzung ist, daß er die aktuellen Datei über einen Verweis aufgerufen hat. Wenn er die Adresse der Datei stattdessen etwa als Lesezeichen ausgewählt oder direkt in die Adreßzeile des Browsers eingegeben hat, ist in document.referrer nichts gespeichert. Beim MS Internet Explorer wird in document.referrer nur dann etwas gespeichert, wenn der Aufruf der aktuellen Datei über das HTTP-Protokoll erfolgte, also mit einem Verweis vom Typ http://...../dieseDatei.htm.
<html><head><title>Test</title> </head><body> <script language="JavaScript"> document.write("<h1>Lieber Besucher</h1>"); document.write("Du hast also von " + document.referrer + " hierher gefunden"); </script> </body></html> |
Das Beispiel gibt im HTML-Text mit der Methode write() aus, von woher der Anwender die aktuelle Datei aufgerufen hat.
Speichert den Titel einer HTML-Datei, wie er bei <title>...</title> vergeben wurde.
<html><head><title>Test</title> </head><body> <h1> <script language="JavaScript"> document.write(document.title); </script> </h1> </body></html> |
Das Beispiel schreibt mit der Methode write() den Titel der HTML-Datei dynamisch als Inhalt in eine Überschrift 1. Ordnung (<h1>...</h1>).
Speichert die vollständige URL-Adresse des aktuellen Dokuments.
<html><head><title>Test</title> <script language="JavaScript"> </script> </head><body> <script language="JavaScript"> document.write("Diese Datei: " + document.URL); </script> </body></html> |
Das Beispiel schreibt mit der Methode write() die eigene vollständige URL-Adresse in den Text. So etwas kann durchaus Sinn machen, beispielsweise, wenn die Datei Teil eines Frame-Sets ist. Anwender können sich dann auf die genaue URL-Adresse beziehen, wenn Sie zu dem angezeigten Frame-Inhalt etwas mitteilen wollen.
Speichert die Farbe für Verweise zu bereits besuchten Seiten, wie beim Attribut vlink= im <body>-Tag oder vom Anwender in seinen Browser-Einstellungen festlegbar (siehe auch Farbe für Text und Verweise).
<html><head><title>Test</title> <script language="JavaScript"> document.vlinkColor = parent.frames[0].document.vlinkColor; </script> </head><body> </body></html> |
Das Beispiel nimmt an, daß sich die aktuelle Datei innerhalb eines Frame-Sets befindet. Beim Einlesen der Datei wird die Farbe für Verweise zu besuchten Seiten in der aktuellen Datei auf die gleiche Farbe gesetzt wie bei der Datei, die sich in einem anderen (dem ersten) Frame-Fenster befindet.
Beachten Sie, daß Farbänderungen für die Verweisfarbe nur Wirkung haben, bevor irgendwelcher HTML-Text eingelesen wurde. Beachten Sie bei den Farbangaben, daß Farben entweder hexadezimal notiert werden, jedoch ohne Gatterzeichen (#) davor wie in HTML, oder in Form erlaubter Farbnamen (siehe auch Farben definieren in HTML). Der Wert muß in jedem Fall in Anführungszeichen stehen.
Überwacht Anwenderereignisse im aktuellen Dokument. Funktioniert genau so wie captureEvents() beim window-Objekt (nähere Informationen siehe dort). Der einzige Unterschied ist, daß Sie mit document.caputeEvents() nur Ereignisse innerhalb des Dokumentfensters überwachen können, keine Ereignisse im gesamten Fensterbereich (zu dem beispielsweise auch Titelleiste, Menüleisten usw. gehören).
Schließt einen Dokumentinhalt, der mit der open()-Methode geöffnet und mit den Methoden write() oder writeln() beschrieben wurde.
<html><head><title>Test</title> </head><body> <script language="JavaScript"> document.open(); document.write(document.URL); document.close(); </script> </body></html> |
Das Beispiel öffnet den Dokumentinhalt zum Schreiben, dann schreibt es etwas (die aktuelle URL-Adresse) mit der Methode write(), und zuletzt schließt es den Vorgang mit document.close() ab.
Ermittelt Text, der vom Anwender im Dokument selektiert wurde.
<html><head><title>Test</title> </head><body> viel Text zum Selektieren viel Text zum Selektieren <form> <input type=button value="zeigen" onClick="alert(document.getSelection());"> </form> </body></html> |
Das Beispiel gibt beim Klick auf den definierten Button das Ergebnis des Aufrufs der Methode document.getSelection() mit alert() aus. Voraussetzung ist, daß zuvor Text selektiert wurde. Ansonsten liefert document.getSelection() eine leere Zeichenkette ("") als Ergebnis.
Übergibt ein Ereignis an ein Element, das in der Lage ist, auf das Ereignis zu reagieren. Funktioniert genau so wie handleEvent() beim window-Objekt (nähere Informationen siehe dort). Der einzige Unterschied ist, daß document.handleEvent() nur Ereignisse übergeben kann, die mit document.captureEvents() überwacht werden.
Öffnet ein Dokument zum Schreiben. Dabei wird kein Fenster geöffnet, sondern der Fensterinhalt zum Neubeschreiben freigegeben. Falls das Dokument vorher einen Inhalt hatte, zum Beispiel eine zunächst geladene HTML-Datei, sollten Sie zuerst die close()-Methode aufrufen.
Kann ohne, mit einem oder mit zwei Parametern aufgerufen werden. Folgende Parameter sind möglich:
1. Mime-Type = Eine Bezeichnung des Mime-Types für die Art der Daten, die in das Dokumentfenster geschrieben werden sollen. So können Sie das Dokumentfenster beispielsweise durch Angabe von "x-world/x-vrml" zum Schreiben von VRML-Code öffnen. Mit write()- und writeln()-Befehlen können Sie dann dynamisch VRML-Code schreiben.
2. replace = mit document.open("text/html","replace") öffnen Sie das Dokument zum Schreiben von HTML und bewirken, daß der neue Dokumentinhalt die gleiche Stelle in der History der besuchten Seiten einnimmt wie das Dokument, in dem der open-Befehl steht.
<html><head><title>Test</title> </head><body> <script language="JavaScript"> function Wechsel() { document.open(); document.write("<a href=\"datei.htm\">Und jetzt steh ich hier</a>"); document.close(); } document.open(); document.write("<a href=\"javascript:Wechsel()\">Noch steh ich hier</a>"); document.close(); </script> </body></html> |
Das Beispielscript führt zunächst den unteren Teil des Codes aus, da der obere in die Funktion Wechsel() eingebunden ist, die erst bei Aufruf ausgeführt wird. Im unteren Teil wird mit JavaScript dynamisch ein Verweis in das Dokumentfenster geschrieben. Wenn der Anwender den Verweis anklickt, wird die Funktion Wechsel() aufgerufen. Diese Funktion öffnet das Dokumentfenster zum neuen Schreiben und schreibt dynamisch einen Verweis auf die aktuelle Datei (im Beispiel wird angenommen, daß diese Datei datei.htm heißt). Klickt der Anwender auf den Verweis, wird die Datei erneut geladen, und dadurch wird wieder der erste Verweis geschrieben.
Beachten Sie, daß das Beispiel erst ab Netscape 3.x so funktioniert wie beschrieben. Netscape 2.x kennt die document.open() zwar auch schon, doch leert dabei das Dokumentfenster nicht.
Beendet die Überwachung von Anwenderereignissen. Funktioniert genau so wie releaseEvents() beim window-Objekt (nähere Informationen siehe dort). Der einzige Unterschied ist, daß document.releaseEvent() nur Ereignisüberwachungen beenden kann, die mit document.captureEvents() gestartet wurden.
Übergibt ein Anwenderereignis an das document-Objekt. Von dort aus wird das Ereignis immer weiter nach unten durchgereicht, bis sich ein Event-Handler findet, der das Ereignis verarbeitet. Funktioniert genau so wie routeEvent() beim window-Objekt (nähere Informationen siehe dort). Der einzige Unterschied ist, daß document.routeEvent() nicht auf Fenster-Ebene ansetzt, sondern auf Dokumentebene.
Gibt Text im Dokument aus. Erwartet eine Zeichenkette oder einen JavaScript-Ausdruck als Parameter.
<html><head><title>Test</title> </head><body> <script language="JavaScript"> DeinName = prompt("Bitte Deinen Namen angeben:","Name"); document.write("Hallo " + DeinName); </script> </body></html> |
Das Beispiel zeigt beim Einlesen der Datei mit prompt() ein Dialogfenster an, in dem der Anwender seinen Namen eingeben soll. Der eingegebene Wert wird in der Variablen DeinName gespeichert. Anschließend wird mit document.write() das Wort "Hallo" mit einem Leerzeichen dahinter geschrieben. An die Zeichenkette angehängt wird die Variable DeinName. Dadurch steht hinterher beispielsweise "Hallo Susi" im Text, wenn in dem Dialogfenster "Susi" als Name angegeben wurde.
Es ist auch erlaubt, mehrere Zeichenketten oder Ausdrücke durch Kommata getrennt innerhalb von document.write() zu verwenden, zum Beispiel:
document.write("Sie benutzen ", document.layers ? "Netscape ab V4" : "nicht Netscape ab V4");
Dieses Beispiel enthält zunächst eine Zeichenkette und dann, durch ein Komma getrennt, einen komplexen Ausdruck, in dem ermittelt wird, ob der Anwender einen Browser benutzt der das layers-Objekt kennt.
Wie write() - fügt jedoch am Ende automatisch ein Zeilenumbruchzeichen ein. Dadurch ist diese Methode vor allem zum Schreiben von Inhalten interessant, bei denen Zeilenumbrüche wichtig sind.
<html><head><title>Test</title> </head><body> <script language="JavaScript"> document.open("text/plain"); document.writeln("erste Zeile"); document.writeln("zweite Zeile"); document.writeln("dritte Zeile"); document.close(); </script> </body></html> |
Das Beispiel schreibt drei Zeilen als Mime-Type "text/plain" (reine Textdatei). Am Ende jedes Befehls document.writeln() wird automatisch ein Zeilenumbruch eingefügt.
weiter: | all |
zurück: | frames |