Javascript Dokument-Objekt

Manipulationen auf der aktuellen Seite

Wie bereits eingangs erwähnt, ist document.write einer der ersten Befehle, die man beim Lernen von Javascript erlebt. Der Zusatz document.* teilt dem Browser mit, dass auf dem aktuellen Dokument, ergo auf der gerade geöffneten und geladenen Webseite ein bestimmter Text geschrieben werden soll - eben der Auftrag write. Wäre document. nicht davor gestanden, wüsste Javascript nicht wirklich, was es mit dem Text anfangen soll.

Was ist das Dokument-Objekt?

Das Dokument-Objekt ist eine wichtige Funktion in Javascript, um auf der aktuellen Seite Veränderungen durchführen zu können. Der Browser erhält über den Javascript-Befehl die Anweisung, was oder wo auf der Seite verändert werden soll und die Möglichkeiten reichen von einer anderen Hintergrundfarbe bis zum Titel der Seite, man kann auch herausfinden, von welcher Seite man gekommen ist oder wann die aktuelle Seite zuletzt verändert wurde.

Damit stehen viele Möglichkeiten zur Verfügung, die allesamt mit dem aktuellen Dokument in Zusammenhang stehen. Die Adressierung in Javascript erfolgt beim Dokument-Objekt immer auf die gleiche Art und Weise, nämlich mit dem voreingestellten

document.<

wobei < der jeweilige Befehl ist, der durchgeführt werden soll.

Was kann man mit dem Dokument-Objekt machen?

Beispiel 1: Hintergrundfarbe

Eine Möglichkeit besteht darin, dass man die Hintergrundfarbe ändert. Der Befehl

document.bgColor = '#eaeaea';

sorgt beim Aufruf dafür, dass sich die Hintergrundfarbe in die angegebene Farbe ändert. Man könnte daher je nach Situation verschiedene Farben auswählen und für einen netten Effekt sorgen.

Beispiel 2: Seitentitel

Ebenfalls ändern kann man den Seitentitel der aktuellen Seite und zwar mit

document.title = "Das ist jetzt etwas anderes";

Beispiel 3: letztes Bearbeitungsdatum

Mit dem Dokument-Objekt lassen sich die verschiedensten Informationen abfragen wie etwa auch das letzte Datum, wann die Seite verändert worden ist.

document.lastModified

könnte zum Beispiel mit document.write verbunden werden.

Beispiel 4: referrer oder: woher kommst du?

Eine weitere Option besteht beim Dokument-Objekt in Javascript beim Abfragen des referrer, also jener Seite, von der aus man die aktuelle Seite hat erreichen kann.

document.referrer

könnte mit document.write genutzt werden, um die letzte Seite anzeigen zu lassen.

Dokument-Objekt in der Praxis

Die vorgestellten Lösungen - man könnte dies noch um Cookies, Öffnen und Schließen von Popups und einigen weiteren Parametern erweitern - sind interessante und dynamische Lösungen, die gerade nach der Etablierung der HTML-Seiten als Homepages gerne eingesetzt wurden.

Aber in der Zwischenzeit gibt es mit PHP eine Skriptsprache, die viele dieser Lösungen wie etwa das Abfragen des Referrer auch beherrschen und manches ist nicht mehr gefragt. Eine Änderung des Titels macht beim Konkurrenzkampf in den Suchmaschinen keinen Sinn und die Hintergrundfarbe ändert man seitenübergreifend per CSS.

Trotzdem ist es wichtig, diese Funktionen zu kennen, um sie zu verstehen, wenn etwa das Objekt document beim Einbinden von Werbecodes angesprochen wird und man daher erkennen kann, was dieser Javascript-Code bewerkstelligt und wie man ihn einsetzen kann.

Lesen Sie auch

Ein wesentlicher Vorteil bei diversen Effekten mit Javascript ist die Tatsache, dass man das aktuelle Fenster und/oder Dokument direkt ansprechen kann. Mit dem Fenster-Objekt kann man festlegen, ob es sich in der Größe verändern darf, beim Dokument-Objekt kann man die Hintergrundfarbe ändern oder andere Daten abrufen.

Weitere Möglichkeiten gibt es mit den Event-Handler. Das sind die berühmten Funktionen rund um Links, wie der Mouseover-Effekt, aber auch bei Formularfeldern gibt es Möglichkeiten. Einige dieser Optionen sind aber durch CSS schon abgelöst worden. Eine andere Variante ist die umfangreiche Bibliothek jQuery, mit der mittels AJAX auch PHP-Abfragen von Datenbanken gelingen, ohne die Seite neu laden zu müssen.

Diesen Artikel teilen

Kategorien

Grundlagen
HTML-Grundlagen
CSS-Grundlagen
Javascript-Grundlagen
PHP-Grundlagen
MySQL-Grundlagen
SEO-Grundlagen

Infos, Tipps, Vermarktung
Webdesign-Lexikon
Online-Werbung
PHP-Codeschnipsel