home  |  suche  |  kontakt/johner  |  institut 
studierende  |  tech-docs  |  mindmailer 
Wie bereits erwähnt, Java und JavaScript haben eigentlich nichts miteinander zu tun. Dennoch gibt es Ähnlichkeiten in der Syntax:
  • Semikolon am Zeilenende, bzw. nach einer Anweisung ;
  • Klammerung {}
  • Kontrollstrukturen: for, while ,if
  • Kommentare: // bzw. mit /*...*/
  • Funktionen, Methoden (bei Objekten)
 

function <'NAME'> (<'Parameter'>) { 
       ...    }       

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


if (bedingung) {

    anweisungen;
} 

else { 

   anweisungen;
}

while (bedingung) {    

anweisungen;
}

for (startausdruck; bedingung; iterationsausdruck) {  

  anweisungen;
}

Vordefinierte Funktionen

      Es gibt zahlreiche vordefinierte Funktion in JavaScript, welche verschiedene Aufgaben erfüllen...

      • alert("Text")  (PopUp-Fenster)
      • eval() (Werte "Formel" aus)
      • parseInt("7") (wandele String in Zahl)
      • Number(Ausdruck) (Konvertierung von Ausdruck nach Zahl)
      • escape(Zeichenkette) (Wandelt Sonderzeichen um)
      • Vollständige Liste auf SelfHTML

      Beispiel für Erzeugen und Anhängen eines Links:

       
      var linkElement= document.createElement("a"); 
      linkElement  .href = "http://www.johner.de";
      linkElement .innerHTML = "Der neue Johner.de-Link";
      document.body.appendChild(linkElement  );
      

      Beispiel für Ersetzen von Inhalten einer Webseite:

      Mit JavaScript und dem Zugriff über DOM ist es möglich HTML-Elemente zu ersetzen oder anzuhängen.

       
      document.getElementById("ergebnis").firstChild.nodeValue="wert";
      

      oder:

       
      var change="

      Geänderter Wert

      "; document.getElementById("Ergebnis").innerHTML = change;

      Beispiel für manipulieren und erzeugen von HTML-Elementen

      In JavaScript können HTML-Elemente erstellt und manipuliert werden

      JavaScript:

       
        function manipulieren(text){
          var ueberschrift = document.getElementById("u2");
          
          //Wert aus Input-Feld auslesen
          var wert = document.getElementById("in").value;
          
          //1. Variante der Manipulation bei bestehendem Element
          ueberschrift.innerHTML = wert;
          
          //2. Variante der Manipulation (Element einfügen)
          var knoten = document.createElement("h4"); //welches Element soll hinzugefügt werden
          var inhalt = document.createTextNode(wert);
          knoten.appendChild(inhalt); //inhalt ist Kindelement von knoten (hinweis DOM-Baum)
          
          var divi = document.getElementById("container");
          divi.appendChild(knoten); //knoten wird in div-Element "container" eingefügt
          }
      

      HTML:

       
      
         

      Uberschrift

      Beim klicken des Buttons wird der Text der Überschrift geändert

      und ein H4-Element in den container eingefügt

      Hier kommt gleich der Text hin