Estoy intentando imprimir un array con objetos dentro hacia una tabla en HTML, pero no puedo hacer que me vaya mostrando en cada celda los datos del array, sino el primer dato de cada objeto.
const corto = [
{
codigo:8324,
localidad:'Garupa',
tipo:'casa',
direccion:'eva peron 897',
descripcion:'4 habitaciones',
nuevaOvieja:'E',
ventaOalquiler:'V',
precio:5300
},
{
codigo:886543,
localidad:'San ignacio',
tipo:'duplex',
direccion:'Madariaga 4949',
descripcion:'2 habitaciones',
nuevaOvieja:'E',
ventaOalquiler:'A',
precio:6200
},
{
codigo:3212,
localidad:'Garupa',
tipo:'depto',
direccion:'Favaloro 8833',
descripcion:'monoambiente',
nuevaOvieja:'E',
ventaOalquiler:'V',
precio:25000
},
{
codigo:664,
localidad:'Posadas',
tipo:'casa',
direccion:'Messi 10',
descripcion:'3 habitaciones',
nuevaOvieja:'U',
ventaOalquiler:'A',
precio:5000
}
]
<body>
<input type="button" value="Genera una tabla" onclick="genera_tabla()">
<script>
var titulos=["codigo","localidad","tipo","direccion","descripcion","Nueva (E) o Usada (U)","Venta o Alquiler","Precio"]
var variables=[ "codigo","localidad","tipo","direccion","descripcion","nuevaOvieja","ventaOalquiler","precio"]
function genera_tabla() {
// Obtener la referencia del elemento body
var body = document.getElementsByTagName("body")[0];
// Crea un elemento <table> y un elemento <tbody>
var tabla = document.createElement("table");
var tblBody = document.createElement("tbody");
// Crea las celdas
for (var i = 0; i < 1; i++) {
// Crea las hileras de la tabla
var hilera = document.createElement("tr");
for (var j = 0; j < titulos.length; j++) {
// Crea un elemento <td> y un nodo de texto, haz que el nodo de
// texto sea el contenido de <td>, ubica el elemento <td> al final
// de la hilera de la tabla
// var celda = document.createElement("td");
var thead=document.createElement("th")
var textoCelda = document.createTextNode(titulos[j]);
thead.appendChild(textoCelda);
hilera.appendChild(thead);
}
// agrega la hilera al final de la tabla (al final del elemento tblbody)
tblBody.appendChild(hilera);
}
for (var i = 0; i < corto.length; i++) {
// Crea las hileras de la tabla
var hilera = document.createElement("tr");
for (var j = 0; j < variables.length; j++) {
// Crea un elemento <td> y un nodo de texto, haz que el nodo de
// texto sea el contenido de <td>, ubica el elemento <td> al final
// de la hilera de la tabla
var celda = document.createElement("td");
var thead=document.createElement("th")
var textoCelda = document.createTextNode(corto[j].codigo);
celda.appendChild(textoCelda);
hilera.appendChild(celda);
}
// agrega la hilera al final de la tabla (al final del elemento tblbody)
tblBody.appendChild(hilera);
}
// posiciona el <tbody> debajo del elemento <table>
tabla.appendChild(tblBody);
// appends <table> into <body>
body.appendChild(tabla);
// modifica el atributo "border" de la tabla y lo fija a "2";
tabla.setAttribute("border", "2");
}
</script>
</body>
Espero que puedan ayudarme, gracias de antemano