Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- modul:m288:learningunits:lu01:aufgaben:05 [2025/08/18 11:45] – vdemir
+++ modul:m288:learningunits:lu01:aufgaben:05 [2025/08/18 13:10] (aktuell) – vdemir
@@ Zeile 6: / Zeile 6: @@
     * VS Code Editor
   * Zeit: 20 Minuten
-  * Erwartetes Resultat: Zwei Arten von HelloWorld (unterschiedlich eingebunden).
+  * Erwartetes Resultat: 3 Buttons, die mittels unterschiedlicher EJS-Einbindung Informationen auf dem Browser ausgeben.
 ===== Ausgangslage =====
-Sie haben im //LU01b - JavaScript in HTML einbinden// gelernt, dass es unterschiedliche Arten gibt JS-Code ins HTML einzubinden. Sie finden nachfolgend die Vorlage zur HTML-Datei, in der Sie die Welt mit //Hello World!// grüssen sollen.
+Sie haben im //LU01b - JavaScript in HTML einbinden// gelernt, dass es unterschiedliche Arten gibt JS-Code ins HTML einzubinden.
 ===== Vorarbeiten =====
-Legen Sie eine Datei //LU01_L05.html// an und kopieren den nachfolgenden Code hinein.
+  - Legen Sie eine Kopie der Datei //LU01_A03.html// an und nennen Sie diese //LU01._A05.html//.
+  - Legen Sie ein Verzeichnis //scripts// für die zukünftigen JS-Scripte an.
+  - Legen Sie in dem Verzeichnis //scritps// eine Datei //LU05_A05.js// an.
+===== Aufgabe =====
+Realisieren Sie basierend auf der Aufgabe //LU01_A03// die nachfolgenden 3 Varianten, wie JavaScript ins HTML eingebunden wird.
+  - Direkt im HTML-Tag: Ausgabe des Datums (Button 1)
+  - Mittels Script-Tags: Ausgabe des Namens (Button 2)
+  - Als separate Datei: Ausgabe der Hobbies (Button 3, muss noch angelegt werden)
+===== Zielvorgabe 1: Dateiorganisation =====
+Ihr Files sollten wie folgt organisiert sein:
+{{:modul:m288:learningunits:lu01:aufgaben:lu01_a05_2.jpg?400|File-Organisation im VS-Code}}
+===== Zielvorgabe 2: Browserausgabe =====
+Ihre Lösung sollte in etwa wie folgt aussehen.
+{{:modul:m288:learningunits:lu01:aufgaben:lu01.a05.jpg?600|Zielvorgabe der Lösung}}
-  <!DOCTYPE html>
-  <html lang="en">
-  <head>
-    <meta charset="UTF-8">
-    <title>JavaScript Essentials</title>
-    <!-- Variante 2 -->
-    <!-- <script src="scripts/02_sayhello.js"></script> -->
-  </head>
-  <h1>How to write some text with JavaScript i.e. Hello ...</h1>
-  <body>
-    <!-- Variante 1 -->
-  <script>
-    // alert("Hello Variante 1!");
-  </script>
-  <!-- Variante 3 -- >
-  <!--  <script src="scripts/LU05_A05.js"></script> -->
-</body>
-</html>
-===== Aufgabe =====
-Grüssen Sie auf drei Arte die Welt, indem Sie drei Arten der JS-Einbindung realisieren.
-  * Incode,
-  * Script-Tag und
-  * Externe JS-Datei
 ===== Lösungen =====