Einbinden der JavaScript Timer Klasse in eine Webseite
12. März 2009 Roland
- Programmierung
- Variablenzuweisungen und Berechnungen
- Alter berechnen nur mit JavaScript
- Alter berechnen mit und ohne Javascript
- Code Optimierung
- Client Server Applikationsarchitektur
- Eigenschaften eines Webbrowsers
- Stylesheets
- Interaktive Webclients
- Mit HTML, oder SVG, interaktive Ein- Ausgaben erstellen
- Mit JavaScript aus einem Dokument Daten lesen
- Der Webserver
- Webserver-seitige Programmierung
- Datenbankanbindung
- Architekturprinzip Separation of Concerns
- Beschreibung von Anwendungsfällen
- Mit JavaScript einen wiederkehrenden Event erzeugen
- Kommunikationswege bei Einsatz von Java auf dem Webclient
- Einbinden der JavaScript Timer Klasse in eine Webseite
- AJAX Kommunikation ohne Fassaden Pattern
- JavaScript Klassen mit Object-Literal Syntax erstellen
- Knackpunkte bei der Klasse AsyncCommunication
- Speicherverbrauch in AJAX Applikationen
- Auch bei JavaScript immer die Variablen sauber deklarieren
- Eventhandler im JavaScript mit dem HTML Dokument verknüpfen
- Objekte in JavaScript mit JSON deklarieren
Ich habe im Artikel Mit JavaScript einen wiederkehrenden Timer erzeugen eine Klasse beschrieben, mit der wir einen wiederkehrenden Event ausführen können. Diese Klasse möchte ich nun in einem Webauftritt einbinden.
Der Quellcode der Klasse wird in der Datei timer.js abgespeichert. In jedem Webauftritt kann sie nun mit der Zeile <script language=”JavaScript” src=”timer.js”>
</script> eingebunden werden.
Eininden des Webauftritt spezifischen Codes
Die Klasse stellt nur den Code für einen wiederkehrenden Event dar. Unsere Logik für den jeweiligen Webauftritt sollten wir auch noch in eine Datei auslagern. In der HTML Datei sollte nur die Einbindung der JavaScript Sourcen vorhanden sein. Der JavaScript Quellcode verursacht ansonsten unleserlichen und schlecht zu wartenden Code.
Ich nenne meine Webauftritt bezogenen Sourcen immer so ähnlich wie den Webauftritt selbst. Wenn der Webauftritt zum Beispiel baldenhofer.eu lautet, dann könnte die spezifische Logik hierzu in baldenhofer.js abgelegt werden. So ist immer klar zu welchem Webauftritt diese Sourcen gehören.
Wenn wir also zum Beispiel jede Minute unseren Webseitenbetrachter mit einer Alert Box nerven wollen, dann können wir eine Datei (baldenhofer.js) mit folgendem Inhalt erstellen:
-
/**
-
* Die folgende Funktion zeigt wie die Timerklasse initialisiert werden muß.
-
*/
-
function initApp(){
-
var timeObject = new Timer();
-
timeObject.setEventTime(60000);
-
timeObject.setEventFunction("alarm()");
-
timeObject.processEvent();
-
}
-
-
/**
-
* Diese Funktion soll alle 60 Sekunden aufgerufen werden.
-
*/
-
function alarm(){
-
alert("Hi, du bist jetzt schon eine Minute hier. Aufwachen!!!");
-
}
Diese Datei binden wir mit <script language=”JavaScript” src=”baldenhofer.js”>
</script> ein. Natürlich müssen wir auch die vorher beschriebene timer.js mit einbinden, da wir ja auf Timer zugreifen wollen.
Damit die initApp() Funktion auch gestartet wird, binden wir den Aufruf in unserem body-Tag des HTML Dokuments ein.
<body onload=”initApp()”>…
</body>
Jetzt wird die Applikation beim Laden des HTML Dokuments initialisiert und gestartet. Jede Minute wird unser armer Besucher nun mit einem Alert() genervt.
Artikel mit ähnlichen Schlagwörtern
Der Beitrag wurde am Donnerstag, den 12. März 2009 um 13:22 Uhr veröffentlicht und wurde unter Programmieren abgelegt.
Dir gefiel der Artikel? Dann abonniere doch den RSS Feed
Du kannst die Kommentare zu diesem Eintrag durch den RSS 2.0 Feed verfolgen. Du kannst einen Kommentar schreiben, oder einen Trackback auf deiner Seite einrichten.
