10-Dreisatz-JS.md

Web: Dynamik

zurück	vorwaerts

Javascript

• Überlege dir, wie die Berechnung des Dreisatzes ausschaut
• Finde heraus, wie die Rechnung gestartet werden kann, wenn der Button geklickt wird
• Lies für die Berechnung die drei Input-Felder aus
• Führe die Rechnung aus und
• Setze das Resultat ins Resultate-Feld ein.
• Füge alle neuen Styles in dein script.js ein.

Hier folgen ein paar Hinweise.

Button finden

const button = document.getElementById('button');

Funktion ausführen bei Klick

button.onclick = function () {
    console.log('click');
}

Wert auslesen

const wert = document.getElementById('input').value;

---

Lösungsvorschlag

function berechneDreisatz() {
    const zahl1 = document.getElementById('zahl-1').value;
    const zahl2 = document.getElementById('zahl-2').value;
    const zahl3 = document.getElementById('zahl-3').value;

    const resultat = zahl3 * zahl2 / zahl1;

    document.getElementById('solution').value = resultat;
}

const calculate = document.getElementById('calculate');

calculate.onclick = berechneDreisatz;

Bei dieser Aufgabe gibt es nicht die eine Lösung. Aber immer einen Lösungsvorschlag.

---

Wir sind fertig. Auf der Abschlussseite findest du die Zusammenfassung: Schritt 11: Abschluss