Webseite Schnellstart – jQuery und JavaScript
Du hast nun gesehen wie man Inhalte mit HTML erstellt und diese mittels CSS designed.
Was dir nun noch fehlt, ist die Dynamik auf deiner Webseite. Also Verhalten, wenn man einen Knopf drückt oder ein Kontaktformular absenden will.
Dafür gibt es JavaScript. In diesem Schnellstartkurs werden wir neben JavaScript auch eine der bis heute immer noch beliebteste Bibliothek verwenden: jQuery.
jQuery hilft dir schneller mit HTML-Elementen in JavaScript zu arbeiten. Aber zuerst wollen wir uns mal JavaScript anschauen!
Da du nun grob weißt was JavaScript ist und wofür man es verwendet, sollst du nun lernen wie JavaScript funktioniert.
Wie funktioniert JavaScript?
JavaScript wird hauptsächlich im Browser ausgeführt. Immer dann, wenn du eine Webseite aufrufst (so wie lerneProgrammieren.de), wird JavaScript im Hintergrund ausgeführt.
Durch JavaScript sind Webseiten dynamisch und fühlen sich wie normale Computerprogramme an.
Keine Installation, alles läuft im Browser
Der Vorteil ist, dass du nur einen Browser (Firefox, Chrome etc.) brauchst, um JavaScript Anwendungen zu nutzen.
Doch wie kommen deine JavaScript Programme in den Browser hinein?
- Beim Aufruf einer Webseite bzw. Webapplikation wird der JavaScript-Code (der sogenannte Quellcode/Quelltext) nachgeladen.
- In einer HTML-Datei (das lernst du später noch), wird deine JavaScript-Datei verlinkt oder der JavaScript-Code eingebettet.
JavaScript unterscheidet sich dadurch auch zu anderen Sprachen. Es muss nicht vorher zu Maschinensprache übersetzt werden. Der Browser führt JavaScript direkt aus, die Software-Profis nennen das interpretieren.
Genug Theorie. Zeit, dass du deinen ersten Code ausführst.
In JavaScript gibt es den alert-Befehl. Mit diesem Befehl kannst du eine einfache Meldung in einer Dialogbox erstellen. Diese wird dann im Browser angezeigt.
Hier ist der Code:
alert("Hallo, ich starte mit JavaScript!");
Probiere es selbst aus in dem folgenden Code-Editor.
Deine Aufgabe:
Schaue dir den untenstehenden Code-Editor an:
- Ändere im Editor den Text auf "Hallo, ich heiße NAME und lerne JavaScript!"
- Trage deinen eigenen Namen ein.
- Drücke auf den grünen Start-Knopf, um deinen Code auszuführen.