JavaScript und das DOM

Mithilfe von JavaScript, das in jedem Browser läuft, werden Webseiten interaktiv. In diesem Kurs wird das Zusammenspiel von HTML, JavaScript und dem DOM behandelt.

So kann man gezielt Elemente in Webseiten ansprechen und durch Anwenderereignisse wie Benutzereingaben Scripte starten, die dann interaktiv sowohl Inhalte als auch Layout verändern.

• 

  Was ist das DOM?
  • Baumstruktur
  • Elementknoten ansprechen
  • Textknoten ansprechen
   
• 

  Eventhandling
  Ereignisse verarbeiten
  • auf Events reagieren
  • Events weitergeben
  • Standardverhalten unterdrücken
   
• DOM-Manipulation
  • Elemente dynamisch
    • erzeugen
    • entfernen
  • Beispiel: ToDo-Liste
    • WebStorage
   

Für viele Webautoren ist JavaScript die erste Programmiersprache, mit der sie zu tun bekommen. HTML und CSS sind zwar auch künstliche Rechnersprachen, aber Auszeichnungssprachen – es lassen sich damit keine Programme schreiben, die Anweisung für Anweisung abgearbeitet werden.

Was zuerst wie eine spitzfindige Unterscheidung klingt, ist ein Unterschied ums Ganze: Mit HTML lassen sich lediglich Texte auszeichnen und Dokumente aufbauen. Mit CSS werden diese Dokumente formatiert. Eine Programmiersprache hingegen funktioniert grundlegend anders und erfordert eine eigentümliche Denkweise und Herangehensweise an Probleme. Die Grundlagen der Programmierlogik können an dieser Stelle nicht beschrieben werden, sie sind aber essentielle Voraussetzung für den Umgang mit JavaScript.

• Was ist das DOM?

Siehe auch

• 

  Einstieg in JavaScript
  • Was ist JavaScript?
  • Erste Schritte
  • Programmieren und Debuggen
   
• JavaScript in HTML einbinden
  • <script>
  • in den head oder body?
  • async und defer
   
• 

  SVG und JavaScript
  • DOM-Scripting
  • Animation
   
• 

  Mouse and More
  • Event-Modelle für Touch- und Maus-Aktionen
  • Region of Interest
  • SVG-Zoom
   
• JavaScript und CSS