home  |  suche  |  kontakt/johner  |  institut 
studierende  |  tech-docs  |  mindmailer 

Java Skript: Einbinden

Java Skript kann man einbetten

  1. im Header
  2. in externer Datei über <script type="text/javascript" src="helloworld.js">
  3. direkt im Body.

Beispiel fürs Einbetten im Header (oder Body)

<script type="text/javascript">
   
</script>
  
In den Java-Skript-Blöcken befinden sich Funktionen (function), die über sogenannte Event-Handler aufgerufen werden:

Beispiel:

<h1 onmouseover="starten();">nur ein Beispiel</h1>

ruft die Funktion starten auf, wenn man mit der Maus über den Überschriftstext "nur ein Beispiel" fährt.

Syntax

Deklaration

  • Entweder gar nicht und einfach verwenden: a= 3
  • Oder: var a = 3;

Wie in Java

  • Zeilen mit Semikolon abgeschlossen
  • Klammerung
  • for, if, while
  • Kommentare: // bzw. /* …*/
  • Operatoren im Wesentlichen

Funktionen, Methoden

Syntax

function <NAME> (<PARAMETER>, <PARAMETER>) {…}

Bsp:
function add(x, y) {
     var z = a + b;
     return z;
}

Weiteres zu Funktionen

  • Können, müssen aber keinen Rückgabewert haben
  • Es gibt vordefinierte: eval(Zeichenkette), Number(Ausdruck), String(Ausdruck), escape(Zeichenkette), parseInt(Zeichenkette) usw.   

Objekte

werden über Funktionen erzeugt:

function Auto(typ, id) {
  this.id = id;
  this.typ=typ;
}
Auto auto = new Auto(A2, 17);

Manipulieren der HTML-Seite

Ziel: Elemente wie

,

usw. auswählen und ändern, z.B. den Text

Auswahl

  • Über Tags mit id="…": document.getElementById("Formular") (liefert ein Element)
    Beispiel <p id="Absatz1">..</p>
  • Über Namen mit name="…" document.getElementsByName (liefert mehrere Elemente)
  • Über Tagnamen: document.getElementsByTagName (liefert mehrere Elemente)

Ändern der Elemente (Text/HTML, Style)

  • Ändern von bereits vorhandenen Attributen:
    document.bgColor="#CCFF00"; (für p ist z.B. nur align definiert)
    document.getElementById("us").style.color="#FF0000";
  • Text/HTML ändern (nutzen um <p> oder <div> durch komplette Tabelle zu ersetzen):
    document.getElementById("tabelle").innerHTML="<p>…</p>";
    document.getElementById("us").firstChild.nodeValue="Ich bin ein neuer Text";
  • Text einfügen über:
    <script type="text/javascript">document.write("<p>Neuer Text<\/p>");</script>