JavaScript lässt die Seite reagieren

Die dritte Sprache des Webs ist JavaScript. HTML gibt einer Seite ihren Inhalt und CSS ihr Aussehen, und JavaScript lässt sie etwas tun: auf Klicks reagieren, ändern, was die Seite zeigt, Formulare prüfen oder neue Daten laden. Anders als HTML und CSS ist JavaScript eine Programmiersprache: Du schreibst Anweisungen, die der Browser nacheinander ausführt.

Die Seite hat jetzt einen Button, darunter einen leeren Absatz und eine dritte Datei, script.js, die die Seite mit der Zeile <script src="script.js"></script> am Ende von index.html lädt. Hier ist das ganze Skript:

const knopf = document.querySelector("#hallo");
const nachricht = document.querySelector("#nachricht");

knopf.addEventListener("click", function () {
    nachricht.textContent = "Hallo! Willkommen auf meiner Seite.";
});

In einfachen Worten:

• Die erste Zeile findet den Button auf der Seite (das Element mit id="hallo") und gibt ihm den Namen knopf.
• Die zweite Zeile findet den leeren Absatz mit id="nachricht" und nennt ihn nachricht.
• Der Rest sagt: Wenn jemand auf den Button klickt, schreibe den Text in Anführungszeichen in den Absatz.

Klicke in der Vorschau auf den Button und sieh zu, wie der Text erscheint. Mach dir vorerst keine Gedanken über all die Klammern und Semikolons. In diesem Lernpfad lernst du, HTML, CSS und JavaScript selbst zu schreiben, eine Sprache nach der anderen, ganz von vorn.