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

    <h1>Addition de deux nombres</h1>

    <label for="nombre1">Nombre 1:</label>
    <input type="number" id="nombre1" placeholder="Entrez le premier nombre">

    <label for="nombre2">Nombre 2:</label>
    <input type="number" id="nombre2" placeholder="Entrez le deuxième nombre">

    <button onclick="additionner()">Additionner</button>

    <p>Résultat: <span id="resultat"></span></p>

    <script>
        function additionner() {
            // Récupérer les valeurs des champs
            var nombre1 = document.getElementById("nombre1").value;
            var nombre2 = document.getElementById("nombre2").value;

            // Convertir les valeurs en nombres et additionner
            var resultat = parseFloat(nombre1) + parseFloat(nombre2);

            // Afficher le résultat
            document.getElementById("resultat").innerHTML = resultat;
        }
    </script>

</body>
</html>