Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- de:modul:m288:learningunits:lu08:loesungen:03 [2025/12/08 15:26] – angelegt vdemir
+++ de:modul:m288:learningunits:lu08:loesungen:03 [2025/12/08 15:32] (aktuell) – [Zielzustand] vdemir
@@ Zeile 2: / Zeile 2: @@
 ===== Auftrag =====
-Erweitern Sie die bestehende HTML-/JavaScript-Seite, welche aktuell Texte mittels //getElementsByClassName()// verändert, um folgende Funktionen:
+Erweitern Sie die bestehende HTML-/JavaScript-Seite, welche aktuell Texte mittels //getElementsByTagName()// verändert, um folgende Funktionen:
-  - Weitere Textabschnitte hinzufügen
+  - Legen Sie ein Array mit einer passenden Anzahl von Früchen an.
-    * Ergänzen Sie mindestens zwei zusätzliche Textfelder (<p>-Elemente) mit je einem eigenen Button.
+  - Die aktuelen Default Texte sollen bei Knopdruck die Methode //machEtwas// aufgerufen werden, sodass neu //Ich liebe ...// und der Früchtename erscheint.
-    * Jeder Button soll beim Anklicken den zugehörigen Text individuell ändern.
+  - Hinweise:
-  - Globale Reset-Funktion erweitern
+    * Die Anzahl Früchte im Array muss der zu anzeigenden Anzahl von Texten entsprechen.
-    * Der bestehende Reset-Button soll nicht nur die ursprünglichen beiden Texte zurücksetzen, sondern alle vorhandenen Texte auf ihren Standardwert setzen.
+    * Zugriff auf die Arrayelemente erhalten Sie über eine zusätzlichen Index //i//, der in der Schleife inkrementiert wird (um eines hochgezählt durch i++)
-  - Bonus (optional, aber gern gesehen):
+    * Den neuen Text dynamisch anpassen können Sie durch diese Zeile durchf^ühren //item.innerHTML = `Ich liebe ${fruechte[i]}`; //
-    * Fügen Sie einen Button hinzu, der alle Textabschnitte gleichzeitig verändert.
-    * Beispiel: Klick → “Alle mögen Saft!” bei jedem Textabschnitt.
-===== Lösungen =====
+===== Zielzustand =====
+| Vor dem Push  | Nach dem Push |
+| {{:de:modul:m288:learningunits:lu08:loesungen:lu08_a03_1.jpg?400|}} | {{:de:modul:m288:learningunits:lu08:loesungen:lu08_l03.jpg?400|}} |
+Der Quellcode der Lösung ist downloadbar: {{ :de:modul:m288:learningunits:lu08:loesungen:lu08_l03.zip |}}
 ----
 [[https://creativecommons.org/licenses/by-nc-sa/4.0/|{{https://i.creativecommons.org/l/by-nc-sa/4.0/88x31.png}}]] Volkan Demir