CSS - kalkulator 01e

https://tworcastron.pl

ZADANIE 1 - Kalkulator

Napisz prosty kalkulator:
- 2 pola na liczby (typu number)
- 4 buttony (+ - / *)
- Wynik powinien pojawiać się na dole "Wynik: x"
- W przypadku prółby dzielenia przez 0 wyświetl błąd "Nie można dzielić przez 0"
<input type="number" id="number01" />
<input type="number" id="number02" />
<button id="add">dodawanie</button>
<button id="sub">odejmowanie</button>
<button id="mul">mnożenie</button>
<button id="div">dzielenie</button>
<p>Wynik: <span id="result"></span></p>
<p id="error"></p>

<script type="text/javascript">
const number1 = document.querySelector('#number01');
const number2 = document.querySelector('#number02');

const addButton = document.querySelector('#add');
const subButton = document.querySelector('#sub');
const mulButton = document.querySelector('#mul');
const divButton = document.querySelector('#div');

const showResult = number => {
    document.querySelector('#result').innerHTML = number;
};

let result;

addButton.addEventListener('click', () => {
    result = Number(number1.value) + Number(number2.value);
    showResult(result);
});
subButton.addEventListener('click', () => {
    result = Number(number1.value) - Number(number2.value);
    showResult(result);
});
mulButton.addEventListener('click', () => {
    result = Number(number1.value) * Number(number2.value);
    showResult(result);
});
divButton.addEventListener('click', () => {
    document.querySelector('#error').innerHTML = '';
    if (number2.value == 0) {
        document.querySelector('#error').innerHTML = 'Nie można dzielić przez 0';
    } else {
        result = Number(number1.value) / Number(number2.value);
        showResult(result);
    }
});
</script>
wynik skryptu

Wynik: