01 – Einführung & Ausgabe 🖨️

🎯 1. Einleitung & W3Schools

In diesem Kapitel hast du vier Wege kennengelernt, um Inhalte auszugeben: console.log(), alert(), document.write(), innerHTML – und zusätzlich die **Benutzereingabe** mit prompt().

Vertiefe dein Wissen auf W3Schools:

🔗 W3Schools – JavaScript Output

🧠 2. KI-Prompt-Training

Aufgabe: Formuliere einen Prompt, mit dem du KI um Hilfe bitten würdest, um die Vor- und Nachteile der vier Ausgabemethoden und prompt() zu erklären – und warum innerHTML die professionelle Wahl für Webseiten ist.

📋 Aufgabe 1: Ausgabemethoden – Vor- und Nachteile analysieren

Stelle dir vor, du berätst eine Webentwicklerin, die eine interaktive Lernplattform baut. Sie möchte ihren Schüler:innen zeigen, wie man in JavaScript etwas „ausgibt“ – ist sich aber unsicher, welche Methode sie in welchem Kontext empfehlen soll.

Deine Aufgabe:

1. Erstelle eine übersichtliche Tabelle mit den fünf Methoden (console.log(), alert(), document.write(), innerHTML, prompt()).
2. Für jede Methode: Gib an
   • welche Art von Inhalt sich damit gut ausgeben/empfangen lässt,
   • welche Benutzergruppe sie erreicht,
   • einen konkreten Anwendungsfall,
   • und ein klares „Vermeiden bei…“-Szenario.
3. Formuliere einen Prompt für eine KI, der genau diese Tabelle erzeugen würde.

🔍 Aufgabe 2: Fehleranalyse & Interaktion mit prompt()

Ein Mitschüler hat folgenden Code geschrieben, um eine Begrüßung auf der Webseite anzuzeigen – aber es passiert nichts:

// Ich möchte, dass "Hallo Welt!" auf der Webseite erscheint.
function begruessen() {
  document.write("Hallo Welt!");
}
begruessen();

Deine Aufgabe:

1. Erkläre schrittweise, warum dieser Code nicht funktioniert.
2. Schlage eine alternative Lösung mit innerHTML vor – inklusive des nötigen HTML-Elements.
3. Erweitere die Lösung: Lass den Benutzer seinen Namen per prompt() eingeben – und zeige dann „Hallo, [Name]! Willkommen auf meiner Seite.“ an.
4. Formuliere einen besseren Prompt an die KI, der diese interaktive Lösung direkt liefert.