Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen Revision Vorhergehende Überarbeitung
Nächste Überarbeitung
Vorhergehende Überarbeitung
de:modul:m288:learningunits:lu01:02 [2026/08/25 12:09] – vdemirde:modul:m288:learningunits:lu01:02 [2026/08/25 12:15] (aktuell) – vdemir
Zeile 11: Zeile 11:
 Der JavaScript-Code wird direkt als Attribut in einem Element reingeschrieben. 👉 Das ist nicht die eleganteste Lösung, aber für schnelle Tests praktisch. Der JavaScript-Code wird direkt als Attribut in einem Element reingeschrieben. 👉 Das ist nicht die eleganteste Lösung, aber für schnelle Tests praktisch.
  
-**HTML-Datei**+**HTML-Datei: LU01b_bsp1.html**
 <code html> <code html>
 <!DOCTYPE html> <!DOCTYPE html>
Zeile 30: Zeile 30:
 JavaScript wird direkt im HTML-Dokument, meist im <head> oder besser am Ende von <body> platziert, damit das DOM schon geladen ist. JavaScript wird direkt im HTML-Dokument, meist im <head> oder besser am Ende von <body> platziert, damit das DOM schon geladen ist.
  
-**HTML-Datei**+**HTML-Datei: LU01b_bsp2.html**
 <code html> <code html>
 <!DOCTYPE html> <!DOCTYPE html>
Zeile 54: Zeile 54:
 Dieser Ansatz ist der saubere Standardweg: Gemäss der Maxime //Teile und herrsche// wird HTML und JS in separaten Dateien gehalten. So bleibt der HTML-Code übersichtlich und JavaScript kann wiederverwendet werden. Dieser Ansatz ist der saubere Standardweg: Gemäss der Maxime //Teile und herrsche// wird HTML und JS in separaten Dateien gehalten. So bleibt der HTML-Code übersichtlich und JavaScript kann wiederverwendet werden.
  
-**HTML-Datei**+**HTML-Datei: LU01b_bsp3.html**
  
 <code html> <code html>
-  <!DOCTYPE html> +<!DOCTYPE html> 
-  <html> +<html> 
-    <head> +  <head> 
-      <title>Externes Script</title> +    <title>Externes Script</title> 
-    </head> +  </head> 
-    <body> +  <body> 
-      <h1>Externes JavaScript</h1> +    <h1>Externes JavaScript</h1> 
-      <h3>Hintergrundfarbe wird auf "lightblue" geändert</h3> +    <h3>Hintergrundfarbe wird auf "lightblue" geändert</h3> 
-      <!-- JS-Code wird direkt aus der Datei geholt und im body verarbeitet --> +    <!-- JS-Code wird direkt aus der Datei geholt und im body verarbeitet --> 
-      <script src="scripts/script.js" ></script> +    <script src="scripts/LU01b_bsp3.js" ></script> 
-    </body> +  </body> 
-  </html>+</html>
      
 </code> </code>
      
-**Script.js**+**JS-Datei: LU01b_bsp3.js**
  
 <code javascript> <code javascript>
  • de/modul/m288/learningunits/lu01/02.1787652545.txt.gz
  • Zuletzt geändert: 2026/08/25 12:09
  • von vdemir