JavaScript und die Konsole

HTML liefert den Inhalt, CSS das Aussehen, JavaScript das Verhalten. Der Browser führt JavaScript selbst aus — ohne Installation.

<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="UTF-8">
    <title>Mein Programm</title>
  </head>
  <body>
    <h1>Hallo!</h1>
    <script src="app.js"></script>
  </body>
</html>

• script-Element:<script src="app.js"></script> lädt die Datei app.js und führt sie aus.
• Position:am Ende des body: Dann sind alle Elemente darüber schon geladen.
• Eigene Datei:HTML, CSS und JavaScript in getrennten Dateien — übersichtlich und wiederverwendbar.
• Reihenfolge:Anweisungen laufen von oben nach unten, eine nach der anderen; jede endet mit ;.
• Kommentar:// Notiz — wird nicht ausgeführt.

Die Konsole ist das Fenster, in dem ein Programm Nachrichten für Entwickler ausgibt. Öffnen mit F12 (Mac: ⌥+⌘+J) → Reiter „Konsole“.

// app.js
console.log("Hallo Konsole!");
console.log(3 + 4);
console.log("3" + 4);

• console.log(…):schreibt den Wert in der Klammer als neue Zeile in die Konsole.
• Text:steht in Anführungszeichen "…" und wird genau so ausgegeben.
• Rechnung:ohne Anführungszeichen wird erst gerechnet, dann ausgegeben.
• Text + Zahl:+ hängt dann aneinander: "3" + 4 ergibt 34.
• Fehler:erscheinen rot mit Dateiname und Zeilennummer; das Programm stoppt an dieser Stelle.

Lies die Zeilen in app.js und tippe, was in der Konsole erscheint. Dann „Ausführen“ — die Konsole zeigt, ob du richtig lagst.

Halte fest: Die Konsole zeigt immer das Ergebnis der Klammer. Ob gerechnet oder aneinandergehängt wird, entscheidet der Typ: Text mit + wird verkettet.