Lernfabrik

📘 Von HTML zu JavaScript-Funktionen

In JavaScript lernst du, Berechnungen nicht nur mit HTML-Elementen durchzuführen, sondern sie in wiederverwendbare Funktionen auszulagern. So trennst du Logik (JavaScript) von Darstellung (HTML).

📊 Divisionsrechner mit HTML

Hier nutzt du Eingabefelder und schreibst das Ergebnis in ein <div>.

÷ 
<input id="zahl1" value="10">
<input id="zahl2" value="2">
<button onclick="dividiere()">Berechnen</button>
<div id="ausgabe"></div>

<script>
function dividiere() {
  var a = document.getElementById("zahl1").value;
  var b = document.getElementById("zahl2").value;
  document.getElementById("ausgabe").innerHTML = a / b;
}
</script>
⚙️ Divisionsfunktion ohne HTML

Hier nutzt du nur eine Funktion mit return. Das Ergebnis kannst du in der Konsole oder mit alert() anzeigen lassen.

function dividiere(a, b) {
  return a / b;
}

// Ausgabe in der Konsole
console.log(dividiere(10, 2);

// Ausgabe mit alert()
alert(dividiere(10, 2));

👉 So wird aus HTML-Logik eine echte JavaScript-Funktion.

✅ Jetzt bist du dran! Klicke auf "Jetzt üben", um eigene Funktionen zu schreiben und auszuführen.

🧩 Aufgabe: Funktionen verstehen
🎯 Lernziel

Schreibe eine Funktion dividiere(a,b), die zwei Zahlen teilt und das Ergebnis mit return zurückgibt.

⚠️ Verwende hier keine HTML-Elemente. Du arbeitest nur mit Logik und Rückgabewerten.

Beispiel:

function dividiere(a,b) {
  return a / b;
}
dividiere(20,4)); // Zeigt 5 im Fenster
🧩 Weitere Aufgaben (4)
🎯 Mehr Übungen zu Funktionen
  1. Funktion addiere(a,b):
    Gib die Summe zurück.
  2. Funktion istGerade(n):
    Gibt true zurück, wenn n gerade ist, sonst false.
  3. Funktion begruessung(name):
    Gibt "Hallo, NAME!" zurück.
  4. Funktion flaecheRechteck(a,b):
    Gibt die Fläche eines Rechtecks zurück (a*b).

👉 Tipp: Du kannst diese Funktionen direkt im Editor testen.

💻 JavaScript-Editor

Schreibe deine eigene Funktion mit return und führe sie aus.

🧾 Ausgabe