Tengo una tabla HTML con un id llamado "tabla-de-datos-body"
, y tengo un arreglo de datos llamado "Datos"
, a través de inputs lleno ese arreglo, el arreglo se llena correctamente pero a la hora de querer imprimir los datos en la tabla sale de la siguiente manera:
Y necesito que se despliegue en linea recta, el primera dato en producto, el segundo en cantidad y el tercero en precio, mi arreglo lo recorro con la siguiente función de javascript:
function addProdsTemp() {
var tabladatos = document.getElementById('tabla-de-datos-body');
let datos = [];
var producto = document.getElementById('producto').value;
var cantidad = document.getElementById('cantidad').value;
var precio = document.getElementById('precio').value;
datos.push(producto, cantidad, precio);
datos.forEach((el, index) => {
tabladatos.innerHTML += "<tr><td>"+ el +"</td></tr>";
});
}
Mi maquetación HTML de la tabla es la siguiente:
<table class="table">
<thead>
<tr>
<th scope="col">Producto</th>
<th scope="col">Cantidad</th>
<th scope="col">Precio</th>
</tr>
</thead>
<tbody id="tabla-de-datos-body">
</tbody>
</table>
¿Cómo podría imprimir esos datos en la tabla en linea recta?
tbody
? no creo que untr
pueda ser hijo directo detable
. Estructuralmente creo que es<table><thead/><tbody/><tfoot/></table>
. Tal vez quieras leer un poco más acerca de las tablas en MDN"tabla-de-datos-body"
? Muéstranos tu código html de tu tabla, posiblemente haya un error de etiquetas.