JavaScript - Suma de elementos div con JavaScript

 
Vista:
sin imagen de perfil
Val: 19
Ha disminuido su posición en 9 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Suma de elementos div con JavaScript

Publicado por kwk3 (8 intervenciones) el 27/07/2020 02:53:04
1
2
3
4
5
6
7
<div class="elemento">4</div>
<div class="elemento">5</div>
<div class="elemento">2</div>
<div class="elemento">1</div>
<div class="elemento">1</div>
<div class="elemento">7</div>
<div class="elemento">4</div>

Me gustaría sumar los valores que están dentro de los divs anteriores seleccionandolos por clase, pero no tengo muy claro cómo lo podría hacer. Sé que debería hacer una suma en bucle que se repitiese tantos ciclos como elementos hay a sumar. He intentado varias formas pero no consigo dar con la tecla...

Sé que hay que utilizar el elemento parseInt porque haciendo sumas sencillas (sin bucle) sí me ha funcionado, pero no sé cómo hacerlo en este caso...

¿Alguien me podría echar una mano? Gracias.

1
2
3
4
5
6
7
8
9
for (i=0;i<=7;i++) {
		var elementoasumar= document.getElementsByClassName("elemento")[i].innerHTML;
		var n= 1;
	var suma = 0;
	var num;
 
		¿¿¿¿¿¿???????
;
	}
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de joel
Val: 3.506
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Suma de elementos div con JavaScript

Publicado por joel (895 intervenciones) el 27/07/2020 09:10:28
Hola, una manera seria algo así (aunque se puede optimizar mas):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div class="elemento">4</div>
<div class="elemento">5</div>
<div class="elemento">2</div>
<div class="elemento">1</div>
<div class="elemento">1</div>
<div class="elemento">7</div>
<div class="elemento">4</div>
 
<script>
const elementoasumar = Array.from(document.getElementsByClassName("elemento"));
let suma = 0;
elementoasumar.forEach(el => suma=suma + +el.innerText);
alert(suma);
</script>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 19
Ha disminuido su posición en 9 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

contar el número de elementos que tienen el valor 1

Publicado por kwk3 (8 intervenciones) el 27/07/2020 10:47:18
Muchas gracias, funciona perfecto. Una pregunta:

1
2
3
4
5
6
7
<div class="elemento">4</div>
<div class="elemento">5</div>
<div class="elemento">2</div>
<div class="elemento">1</div>
<div class="elemento">1</div>
<div class="elemento">7</div>
<div class="elemento">4</div>


Si quisiese contar el número de elementos que tienen el valor "1", ¿sabes cómo podría hacerlo?

Me gustaría encontrar una función que contase todos aquellos elementos que tienen el valor 1 y que me devolviese el valor de estos.

Algo así como "el total de elementos que tienen el valor 1 es: X (en este caso sería 2)".

Gracias!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de joel
Val: 3.506
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

contar el número de elementos que tienen el valor 1

Publicado por joel (895 intervenciones) el 27/07/2020 11:13:48
para contarlos, puedes utilizar la función reduce...
1
alert(Array.from(document.getElementsByClassName("elemento")).reduce((sum, el) => el.innerText=="1" ? ++sum : sum, 0));
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
sin imagen de perfil
Val: 19
Ha disminuido su posición en 9 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

contar el número de elementos que tienen el valor 1

Publicado por kwk3 (8 intervenciones) el 28/07/2020 13:57:49
¡Muchas gracias!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar