Javascript Tutor - Lektion 3
Wie ich schon gesagt habe, ist Javascript sehr mächtig. Wir können damit in eine von zwei Dutzend verschiedene Richtungen gehen. Ich werde da und dort ein wenig herumlaufen und so viele grundlegende Dinge ansprechen, wie möglich. Ich werde versuchen, es auch zu erläutern.
So, was nun? Lass uns eine EingabeBox hinzufügen, die nach unseren Namen fragt und dann eine personalisierte Hallo-Meldung ausgibt.
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="javascript"><!--
function HelloWorld()
{
meinname = prompt("Wer bist Du denn?", "");
alert ('Hallo ' + meinname);
}
//--></SCRIPT>
</HEAD>
<BODY>
<A HREF="javascript:HelloWorld()">Hallo</A>
</BODY>
</HTML>
|
Ist das nicht cool?
Der Teil in der EingabeBox, der anzeigt "Wer bist Du denn?", ist selbsterklärend. Aber was bedeuten die leeren doppelten Anführungszeichen ("")? Das ist die Standard-Zeichenkette. Du kannst auch etwas in die Anführungszeichen schreiben (wie "Sporto") und es noch mal aufrufen, um die Auswirkung zu sehen.
Beachte auch, dass wir etwas Seltsames getan haben. Wir setzten die Variable meinname der prompt-Funktion gleich...
meinname = prompt("Wer bist denn Du?", "");
Erscheint Dir sonderbar? Nun, was wir wirklich sagen ist, dass der Wert von meinname jeder beliebige Wert sein kann, den die EingabeBox zurückgibt. Und sie gibt zurück, was immer Du in die EingabeBox eingibst. Also ist meinname gleich dem beliebigen Eingabewert der EingabeBox. Verstanden?
Erinnerst Du Dich, dass ich sagte, dass wir zu den Klammern zurückkehren ()? Nun, jetzt ist die Zeit dafür gekommen. Zuerst schauen wir uns das Endergebnis an, dann kommen wir zurück und sprechen über das, was passiert ist.
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="javascript"><!--
function HelloWorld(name)
{
alert ('Hallo ' + name);
}
//--></SCRIPT>
</HEAD>
<BODY>
<A HREF="javascript:HelloWorld('Joe')">Hallo Joe</A>
<BR><A HREF="javascript:HelloWorld('Tom')">Hallo Tom</A>
<BR><A HREF="javascript:HelloWorld('Frank')">Hallo Frank</A>
<BR><A HREF="javascript:HelloWorld('Bob, Carol, Ted & Alice')">Hallo an ein paar andere Leute.</A>
</BODY>
</HTML>
|
Siehst Du, was hier passiert?? Wir übergeben Werte an die Funktion. name ist eine Variable, die in dieser Funktion verwendet wird. Wenn wir 'Joe' oder 'Tom' oder sonst etwas an die Funktion übergeben, nutzt das die Funktion für die Variable name. Das Übergeben von Variablen ist eine sehr nützliche Sache. Wir können eine Funktion einmal schreiben und dann tausend mal verwenden und erhalten immer andere Ergebnisse, abhängig davon, was wir an sie übergeben haben.
Da man am besten durch Üben lernt, habe ich etwas zu tun für Dich...
Übung: Erstelle eine Webseite und füge diese drei Grafiken ein...
Mach, dass beim Klicken auf die jeweilige Zahl eine Pop-Up Box ausgibt: "Du hast auf die 1 geklickt" (oder 2 oder 3).
Es gibt noch etwas, dass ich betonen muss - 90% des Erlernens kommt durch diese Übungen. Wenn Du sie überspringst, wirst Du nicht viel aus dieser Anleitung lernen. Wenn Du jede dieser Übungen probierst, fängst Du langsam an, dieses Thema zu verstehen. Aber merke, dass es nur langsam geht. Es gibt nicht viele Genies auf dieser Welt - der Rest von uns muss angestrengt lernen und hart daran arbeiten.
Ich hoffe, Du hast das verstanden.
Also, hier noch eine Übung.
Übung: Kombiniere die Pop-Up Box aus der letzten Übung so, dass beim Anklicken nach Deinem Namen gefragt wird und die AlertBox zurückgibt: "Hey Joe, Du hast auf die 1 geklickt."
| << Zurück Weiter >> |
 |
 |
