m (Anchor FFError added) |
|||
| Line 49: | Line 49: | ||
'''Wichtig''':<br/> | |||
Firefox interpretiert die verkürzte XML-Notation nicht korrekt: <source lang="HTML4Strict"><script type="text/javascript" src="meinScript.js" /></source><br/> | Firefox interpretiert die verkürzte XML-Notation nicht korrekt: <source lang="HTML4Strict"><script type="text/javascript" src="meinScript.js" /></source><br/> | ||
Deshalb sollten externe Scripte immer wie folgt eingebunden werden: <source lang="HTML4Strict"><script type="text/javascript" src="meinScript.js"></script></source> | Deshalb sollten externe Scripte immer wie folgt eingebunden werden: <source lang="HTML4Strict"><script type="text/javascript" src="meinScript.js"></script></source> | ||
| Line 55: | Line 55: | ||
{{Template:Webprogramming_Kommentare}} | {{Template:Webprogramming_Kommentare}} | ||
== Funktionen == | == Funktionen == | ||
Revision as of 13:47, 24 November 2009
Hallo Welt
JavaScript ist eine Clientseitige programmiersprache. Der Quellcode wird im Klartext an den Browser übertragen und erst dort (im Browser des Surfers) interpretiert und ausgeführt. Im Gegensatz dazu ist PHP eine serverseitige Programmiersprache.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>025_javascript</title>
<script language="javascript" type="text/javascript">
<!--
document.write("<p><i>Hallo Welt!</i></p>");
-->
</script>
</head>
<body>
<script language="javascript" type="text/javascript">
<!--
var meinDatum = new Date();
document.write("<p>Da hat um " + meinDatum.getHours() + ":" +
meinDatum.getMinutes() + " Uhr jemand <i>Yippee!</i> gerufen...</p>");
-->
</script>
</body>
</html>
Einbinden von JavaScript in HTML-Dateien
Javascript kann mit den <script></script> Tags eingebunden werden. Üblicherweise geschieht das im Head-Bereich, kann aber prinzipiell auch im Body erscheinen (s.oben).
<!-- 2 Möglichkeiten JavaScripte im Header einzubinden: extern als Verweis -->
<script language="javascript" type="text/javascript" src="026_toggle.js"></script>
<!-- ...und intern -->
<script language="javascript" type="text/javascript"><!--
function showAlert(myMsg) {
// zeige alert
alert(myMsg);
}
--></script>
Wichtig:
Firefox interpretiert die verkürzte XML-Notation nicht korrekt:
<script type="text/javascript" src="meinScript.js" />
Deshalb sollten externe Scripte immer wie folgt eingebunden werden:
<script type="text/javascript" src="meinScript.js"></script>
Kommentare
Übersicht Kommentarfunktion in HTML, CSS, JavaScript und PHP:
| Sprachen | Syntax |
| HTML | <!-- Mehrzeiliger Kommentar --> |
| PHP, JavaScript, CSS | /* Mehrzeiliger Kommentar */ |
| PHP, JavaScript | // Einzeiliger Kommentar |
| PHP | # Einzeiliger Kommentar |
Funktionen
Funktionen sind gruppierte Einheiten, die eine bestimmte Aufgabe haben. In JavaScript heißen Funktionen Methoden. Eine Methode (oder Funktion) erkennt man an den beiden runden Klammern. Üblicherweise sollten Funktionen durch ein Verb benannt sein. Z.B. doSomething(); oder getItem();.
Das Semikolon schließt einen Ausdruck ab. Zeilensprünge oder Leerzeichen sind unrelevant; der JS Compiler sieht alles als eine "Zeile" an, bis er auf ein Semikolon trifft.
function showAlert(myMsg) {
// zeige alert
alert(myMsg);
// füge "Funktion ausgeführt!" Text der Liste am Ende hinzu
// erstelle ergebnisTag
var myNewListItem = document.createElement("li");
var myText = document.createTextNode("Die Funktion wurde erfolgreich aufgerufen!");
myNewListItem.appendChild(myText);
// finde ergebnisListe und füge neuen ergebnisTag hinzu
var myErgebnisListe = document.getElementById("ergebnisListe");
myErgebnisListe.appendChild(myNewListItem);
}
Variablen
Um eine Variable zu benutzen, muss man:
- Die Variable deklarieren (mit dem Schlüsselwort var): var a;)
- Der Variablen einen Wert zuweisen, d.h. sie initiieren: a = 1;
- Die Punkte 1. und 2. können auch zusammengefasst werden: var a = 1;
Im Gegensatz zu vielen anderen Sprachen, haben Variablen in JavaScript keine explizite Typ-Zuweisung (non-typecasted), d.h. eine Variable kann Werte beliebiger Typen enthalten. In Javascript gibt es Numbers (bool, int, float, ...), und Strings (char, string).
Sichtbar wird dies an folgendem Beispiel:
var a = 5;
var b = 4;
var c = a + b;
// c hat den Wert der Zahl 9ein anderes Ergebnis, wenn die Zahl 4 mit dem String "5" addiert wird - das "+"-Zeichen ist hier kein Additionszeichen mehr, sondern ein sog. Verkettungsoperator, der zwei Strings zusammensetzt:
a = "5";
b = 4;
c = a + b;
// c ist nun ein String mit dem Wert "54"!
Weiterführende Links
Diese Seite ist Teil der Werkmodule Grundlagen der Webprogrammierung und WebApps - Grundlagen Webprogrammierung von Michael Markert für Interface Design / Fakultät Medien an der Bauhaus-Universität Weimar.