1
votes

comment puis-je sélectionner tous les lis puis ajouter tous ses numéros ensemble?

  <div id=â€œcontainerâ€> 
<!--i want to select all the li and the add all their numbers together -->
            <ul> 
                <li>5</li> 
                <li>10</li> 
                <li>15</li> 
                <li class="child">20</li> 
                <li>25</li> 
                <li>30</li> 
                <li>25</li> 
                <li>30</li> 
                 <li>25</li> 
                <li>30</li> 
                <li>25</li> 
                <li>30</li>
            </ul> 
    </div> 
i want to select all the li and the add all their numbers together
i want to select all the li and the add all their numbers together

javascript html arrays input selector

2 commentaires

vous utilisez un sélecteur avec une boucle et un opérateur

S'il s'agit d'une opération ponctuelle, les utilisateurs peuvent ouvrir le code HTML dans un navigateur, le copier et le coller sous forme de texte dans Excel, puis y utiliser la fonction de somme.

4 Réponses :

3
votes

Vous pouvez utiliser la fonction document.querySeclectorAll et la fonction réduire pour ajouter les valeurs.

<div id="container">  <!--i want to select all the li and the add all their numbers together -->  <ul>    <li>5</li>    <li>10</li>    <li>15</li>    <li class="child">20</li>    <li>25</li>    <li>30</li>    <li>25</li>    <li>30</li>    <li>25</li>    <li>30</li>    <li>25</li>    <li>30</li>  </ul></div>

let result = Array.from(document.querySelectorAll('#container li')).reduce((a, {textContent}) => a + +textContent, 0);
console.log(result);

0 commentaires

0
votes

Utilisez une NodeList pour parcourir en utilisant getElementsByTagName():

var lis = document.getElementById("container").getElementsByTagName("li");

Parcourez la liste comme on le ferait sur un tableau .

0 commentaires

1
votes

Vous pouvez essayer avec querySelectorAll () et forEach()

<div id="container"> 
  <ul> 
      <li>5</li> 
      <li>10</li> 
      <li>15</li> 
      <li class="child">20</li> 
      <li>25</li> 
      <li>30</li> 
      <li>25</li> 
      <li>30</li> 
       <li>25</li> 
      <li>30</li> 
      <li>25</li> 
      <li>30</li>
  </ul> 
</div>

var sum = 0;
document.querySelectorAll('#container ul > li').forEach(function(el){
  sum += Number(el.textContent);
});
console.log(sum);

2 commentaires

@Kobe cet exemple est plus facile à comprendre pour ceux qui ont commencé à apprendre js

Assez juste @Mamun

0
votes

let li = [...document.querySelectorAll('#container ul > li')]; //
let counter = 0; //the sum of all li

li.forEach(el => {
    counter += el.textContent * 1;
});

1 commentaires

Bien que cet extrait de code puisse répondre à la question, y compris une explication de pourquoi et comment il aide à résoudre le problème améliore la qualité et la longévité de votre réponse. Consultez "Comment rédiger une bonne réponse?" .