Added: Exercises

2026-06-17 14:45:58 +02:00
parent 3c618cf1e0
commit 86e9bcea64
11 changed files with 586 additions and 0 deletions
--- a/01_grundlagen/uebungen/#u12_prompt-lieblingsessen.html
+++ b/01_grundlagen/uebungen/#u12_prompt-lieblingsessen.html
@@ -0,0 +1,51 @@
+<!doctype html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Übung 12: Mit prompt das Lieblingsessen erfragen</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" />
+  </head>
+  <body>
+    <main>
+      <div class="container py-5">
+        <div class="alert alert-primary my-3">
+          <h2>Übung 12: Mit prompt das Lieblingsessen erfragen</h2>
+
+          <ol>
+            <li>
+              Fragen Sie den Benutzer nach seinem Lieblingsessen und seinem Lieblingsgetränk und speichern Sie beides in
+              passend benannte Variablen.
+            </li>
+            <li>
+              Verwenden Sie beide Variablen in einem Satz, den Sie über die Konsole ausgeben. Verketten Sie dabei die
+              Variablen mithilfe des Verkettungsoperators mit den restlichen Satzteilen .
+            </li>
+            <li>
+              Führen Sie die letzte Übung noch einmal durch, aber verwenden Sie dieses Mal Template String
+              Substitutions.
+            </li>
+            <li>
+              Wenn Sie ganz fleißig sind, können Sie als dritte Variante noch austesten, wie sich beide Varianten in der
+              gleichen Ausgabe verwenden lassen.
+            </li>
+          </ol>
+        </div>
+
+        <div class="alert alert-success my-3 output-a"></div>
+        <div class="alert alert-danger my-3 output-b"></div>
+        <div class="alert alert-warning my-3 output-c"></div>
+      </div>
+    </main>
+    <script>
+      'use strict';
+
+      const outputAEl = document.querySelector('.output-a');
+      const outputBEl = document.querySelector('.output-b');
+      const outputCEl = document.querySelector('.output-c');
+
+      const favoriteFood = prompt('Dein Lieblingsessen ist..?');
+      const favoriteDrink = prompt('Dein favorisiertes Getränk ist..?');
+    </script>
+  </body>
+</html>