Por favor, tengo una duda aqui sobre insertar elemento en un codigo HTML a través de Javascript. Estoy haciendo una pruebas de insertar elementos que son alimentados por un objeto de dos elementos. Es decir, un arreglo de objetos. Utilizo una funcion para crear los elementos a ser incorporados en el HTML, y utilizo el metodo de innerHTML para incluirlos en el DOM. Como son dos elementos utilizo un forEach y dentro de el un for para llegar a cada uno de los elementos.
El codigo que estoy utilizado es el siguiente:
function insertarProducto() {
const totalProductos = productoPrueba.length;
productoPrueba.forEach( producto => {
for (let i = 0; i <= totalProductos; i++) {
const resumenProductos = document.createElement('tr');
resumenProductos.appendChild(imagen);
resumenProductos.innerHTML +=
`
<td>${productoPrueba[i].Descripcion}</td>
<td>${productoPrueba[i].Precio}</td>
<td>${productoPrueba[i].Moneda}</td>
<td>${productoPrueba[i].Cantidad}</td>
`;
Compras.appendChild(resumenProductos);
}
Cuando ejecuto esas lineas, el codigo deja de fucnionar y me aparece un TypeError indicando que la propiedad esta indefinida, por lo que no me permite aplicar las demas funciones.
Alguien me podria indicar que ven alli que hace que me aparezca el TypeError? o al menos que esta errado alli?
productoPrueba.forEach()
es lo mismo quefor(let i = 0; i < productoPrueba.length; i++) {}