2 votes

comment itérer à travers les éléments HTML et additionner les valeurs en utilisant la boucle for

J'ai un problème avec l'utilisation de la boucle for pour additionner les valeurs à travers les éléments dans le HTML en appuyant sur le bouton mais le code n'a pas fonctionné correctement. J'ai aussi essayé de montrer une alerte avec un massage qui dit " pas un numéro "mais à chaque fois, le même massage apparaît dès que j'appuie sur le bouton.

 <!DOCTYPE html>
    <html lang="en">
    <head>
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=, initial-scale=1.0">
     <title>Document</title>
    </head>
    <body>
     <input class="inp" type="" placeholder="Enter  a Number " > 
     <input class="inp" type="" placeholder="Enter  elec" > 
     <input class="inp" type="" placeholder="Enter  food  " > 
     <input class="inp" type="" placeholder="Enter  car " > 
     <input class="inp" type="" placeholder="Enter  resturent " >

     <h1 class="total">total</h1>
     <button class="btn">calculate</button>
     <script 
        const btn= document.querySelector('.btn')
        const total = document.querySelector('.total')
        const inp = document.querySelectorAll('.inp')

    btn.addEventListener('click',function(){

    if (isNaN(inp.value)) {
      alert("Not a number")
      console.log(inp.value);
    } if (inp.value === ""){
      alert("enter  number ")

    } 

     for (let i = 0; i <inp.length; i++) {
      let index = 0
      const current = index + inp[i].value 
       total.innerHTML = index

    }

    })
   </script>
    </body>
    </html>

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X