Javascript Tutor - Lektion 1
Lass uns mit dem traditionellen Hallo Welt! anfangen. Es scheint so, als ob alle Programmieranleitungen damit beginnen.
Kopiere folgendes und speichere es ab als hallo.html..
<HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> </BODY> </HTML> |
Füge nun die SCRIPT und Kommentar-Tags in den HEAD-Bereich ein. Dadurch erreichst Du ein paar Dinge. Das Script-Tag sagt dem Browser, das darin eine Scriptart enthalten ist (in diesem Falle "Javascript"). Es enthält auch Kommentar-Tags, sodass ältere Browser oder Nicht-JS-fähige Browser diesen Scriptteil ignorieren. Als letztes folgt der Javascript-Kommentar (//), den wir später kennen lernen.
<HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="javascript"><!-- //--></SCRIPT> </HEAD> <BODY> </BODY> </HTML> |
Jetzt machen wir eine Funktion. Eine Funktion macht etwas. Es führt eine Reihe von Anweisungen aus. Wir werden mit einer leeren Hülle starten...
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="javascript"><!--
function ()
{
}
//--></SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
|
Jetzt fügen wir den Funktionsnamen und eine Meldungsbox hinzu, die "Hallo Welt!" ausgibt...
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="javascript"><!--
function HelloWorld()
{
alert ("Hallo Welt!");
}
//--></SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
|
Beachte, wie die Funktion strukturiert ist. Das Wort function legt fest, dass es wirklich eine Funktion ist. Der Funktionsname ist HelloWorld. Die Funktion der Klammern ( ) werden wir später erklären und die geschweiften Klammern { } beinhalten eine Reihe von Instruktionen.
So, das ist alles, was die Funktion im HEAD-Tag benötigt. Sie sitzt dort und wartet auf ihren Aufruf. Wie wär's, wenn wir sie auf Mausklick auf einen Link ausführbar machen würden? Das klingt gut. Hier ist ein Link, der ersteinmal noch nirgendwo hin führt.
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="javascript"><!--
function HelloWorld()
{
alert ("Hallo Welt!");
}
//--></SCRIPT>
</HEAD>
<BODY>
<A HREF="">Hallo</A>
</BODY>
</HTML>
|
Jetzt zeige auf die Funktion...
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="javascript"><!--
function HelloWorld()
{
alert ("Hallo Welt!");
}
//--></SCRIPT>
</HEAD>
<BODY>
<A HREF="javascript:HelloWorld()">Hallo</A>
</BODY>
</HTML>
|
Nun, was hast Du gesehen? Dein erstes Javascript.
Bevor wir weitermachen, müssen wir noch etwas klarstellen. Javascript und Java sind zwei grundlegend verschiedene Dinge. Was wir gerade erstellt haben, ist Javascript, NICHT Java. Java ist eine ganz andere Sache. Das einzige, was beide gemeinsam haben sind die Buchstaben J-A-V-A in ihrem Namen. Vor langer, langer Zeit erstellte Netscape eine neue Scriptsprache für seinen Browser. Sie nannten es LiveScript. Zu dieser Zeit erlangte die Java Programmiersprache an Popularität, so dass die Leute bei Netscape ihre Scriptsprache umbenannten in JavaScript, um die Java-Welle mitzunehmen. Seitdem werden diese beiden Sprachen immer verwechselt. Um diese Verwirrung zu vergrößern, fand Microsoft, dass das Scripting eine coole Sache ist und entschied, es in ihre Browser zu integrieren. Aber sie nannten es Jscript. (Mann, was für ein cleverer Haufen.)
Und um die Verwirrung weiter zu steigern gibt es nicht nur Unterschiede zwischen dem Javascript von Netscape und dem JScript von Microsoft, sondern auch, da Javascript eine sich entwickelnde Scriptsprache ist, Unterschiede in der Unterstützung der Versionen durch die Browser. Meine Güte. Nun kommen die guten Neuigkeiten... der größte Teil des Javascripts ist recht einfach und wird von der Mehrheit der modernen Browser leicht gehandelt. Und ALLES Scritping, was wir in dieser Anleitung besprechen, wird durch alle wichtigen Browser gehandelt.
Und noch eines, weil ich gerade daran denke und es sehr wichtig ist ... Javascript unterscheidet Groß- und Kleinschreibung. Noch mal...
JAVASCRIPT UNTERSCHEIDET GROSS- UND KLEINSCHREIBUNG
Die Funktion HelloWorld ist nicht die selbe wie helloworld. Sei sehr achtsam dabei. Fehler durch falsche Schreibweise können sehr frustrierend sein, weil Du eine Fehlermeldung erhältst wie MyVariable existiert nicht, wenn sie doch klar und deutlich heißt - myvariable. Verstehst Du?
| << Zurück Weiter >> |
 |
 |
