Esercizio guidato: Area del Rettangolo

File main.ts

function calcolaAreaRettangolo(base: number, altezza: number): number{
    return base * altezza;
}


onload = () => {
    let btnCalcola:HTMLButtonElement = document.getElementById("calcola") as HTMLButtonElement;
    let spazioRisultato: HTMLParagraphElement = document.getElementById("risultato") as HTMLParagraphElement;

    btnCalcola.addEventListener('click', ()=> {
        let inputBase: HTMLInputElement = document.getElementById("base") as HTMLInputElement;
        let inputAltezza: HTMLInputElement = document.getElementById("altezza") as HTMLInputElement;

        if(inputBase.value && inputAltezza.value){
            let b = Number(inputBase.value);
            let a = Number(inputAltezza.value);
            let area = calcolaAreaRettangolo(b, a);
            spazioRisultato.innerHTML = "<h2> Il risulato è: "+ area + "</h2>";
        }else {
            console.error("Errore dati");
        }
    });
}

file index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <h1>Calcolatore area Rettangolo</h1>
    <input type="number" id="base">
    <input type="number" id="altezza">
    <button id="calcola">Calcola</button>

    <p id="risultato"></p>

    <script src="./main.js"></script>
</body>
</html>