Question

el siguiente codigo se encargaria de agregar los items al array para posteriormente sumarlos y mostrar en la pagina el resultado

el primer obstaculo y causa de confusion es la cuestion de asociar un
elemento del dom a un numero por ej div producto = 10

el segundo es el problema de mostrar la longitud del array por la pagina por ej, si en mi array existen 10indices, estos 10 lo puedo llamar solo con la funcion consolelog si en cambio trato de mostrarlo en la pagina con innerHTML este no me muestra nada.

he pensado que la causa del problema podria ser porque este es un objeto y para mostrarlo necesito convertirlo en cadena

tercer problema mi boton no es reconocido como funcion

codigo html de mi boton encargado de agregar el elmento a mi array

<button id="prod1" onclick="sumar()">sumar producto</button>

codigo encargado de sumar todos los elementos del array y devolver el resultado

<button id="calcolo" onclick="calculo()">calculo</button>

var elementos = []; // array vacio disponibile a contener elementos
var elemento = getElementById('prod1'); // seleccion del elemento

var elemento = 50; // asociando el elemento a un numero entero

function sumar () {

elementos.push(elemento);

}

function calculo() {

  var indicador = getElementById('sumatotal');
  var suma = elementos.length;
  indicador.innerHTML=[suma];
  console.log(suma);

alert ("esto es una prueba");

getElementById('calcolo').addEventListener('onclick', function() {
  alert("esto es una prueba");
} );

}

Answer 1

Tu primer problema no lo he entendido bien, si te refieres a cómo asociar un valor al botón, lo puedes hacer de mil maneras, dependiendo de cómo generes tu página, y puedes por ejemplo que ese valor se pase en la llamada a sumar():

<button id="prod1" onclick="sumar(50)">sumar producto</button>

O que esté como attributo de ese botón (o de otro elemento relacionado con ese botón):

<button data-value="50" id="prod1" onclick="sumar()">sumar producto</button>

Y de esta manera lo puedes recuperar con jQuery así en la función del onclick:

$value = $(this).data('value');

Para el segundo problema, no he probado tu código, pero creo que lo único que te pasa es que no sé por qué estás asignando al innerHTML un array [suma] en lugar de simplemente la suma:

indicador.innerHTML = suma;

Por otro lado, tal y como tienes tu código, sumaría número de elementos, no "valores" del elemento, o bien en la función suma, o bien en la función calculo deberías recoger ese valor, no la longitud del array elementos.

También deberías tener algún control para que el usuario no pulse dos veces sobre el mismo elemento y no se añada este dos veces (a no ser que sí esté permitido añadir el mismo elemento más de una vez)