Meldung

20.08.2007 - Ein JavaScript Countdown Timer

Egal ob Geburtstag, Jubiläum oder einfach das Weihnachtsfest. Mit dem JavaScript Countdown Timer können Sie sich die verbleibende Zeit bis zum ersehnten Ereignis als Countdown anzeigen lassen. Der Countdown wird per JavaScript automatisch einmal pro Sekunde aktualisiert. Zur Anwendung kommt dabei eine Methode des JavaScript Window-Objekts, die zyklisch in einer Endlosschleife den angegebenen JavaScript-Ausdruck ausführt. Die Methode mit dem Namen setInterval führt auf diese Weise eine Funktion aus, deren Aufgabe es ist den Inhalt eines HTML-Elements laufend zu aktualisieren. Zwei weitere Funktionen berechnen die zeitliche Differenz, die zwischen zwei Timestamps liegt oder dienen der Initialisierung des Countdown timers. Das Gegenstück zur Methode setInterval, die Methode clearInterval, die zum Abbruch eines eingeleiteten zyklischen Funktionsaufruf dient, wird ebenfalls im Beispielbereich beschrieben.

Eine weitere Methode des Window-Objekts ist die Methode setTimeout. Anders als die Methode setInterval wird der Aufruf, welcher der Methode setTimeout übergeben wird nach Ablauf des Timeouts lediglich einmal ausgeführt. Auch diese Methode verfügt über ein entsprechendes Gegenstück – diese Methode trägt den Namen clearTimeout –, welches das Timeout beendet.

Zur Initialisierung des Countdown Timers werden einige Angaben benötigt. Neben der ID eines HTML-Elements, in dem die Ausgabe erfolgen soll, wird ein JavaScript Date-Objekt, in dem der Termin angegeben wird und ein optionaler Parameter, der eine Beschreibung des Termins enthält. Diese Terminbeschreibung wird in Form einer Zeichenkette übergeben. Bei der Ausgabe des Counterstandes wird wiederum auf eine Methode des vordefinierten JavaScript-Objekts Document zurückgegriffen. Der HTML-Elementknoten des Ausgabeelements, dessen ID durch die Initialisierung bekannt ist, wird bei jeder Aktualisierung des Timers mit der Methode getElementById ermittelt. Jeder Aufruf der Aktualisierungsfunktion überschreibt dann den Inhalt des Ausgabeelements.

Alexander Müller