Olá Gabriel, tudo bem com você?
Peço desculpas pela demora no retorno.
Uma forma simples de fazer isso utilizando JavaScript será utilizando o método insertRow()
para criar uma nova linha na tabela e, em seguida, utilizar o método insertCell()
para criar as células da tabela e preenchê-las com os valores dos arrays. Percorrendo os arrays através de um laço for
.
Segue um exemplo de código:
<table id="minha-tabela">
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<style>
#minha-tabela {
border-collapse: collapse;
width: 100%;
border: 1px solid #ddd;
}
#minha-tabela th {
border: 1px solid #ddd;
padding: 8px;
text-align: center;
font-weight: bold;
}
#minha-tabela td {
border: 1px solid #ddd;
padding: 8px;
text-align: center;
}
</style>
<script>
const coluna_um_valores = [1,6,11,16,21];
const coluna_dois_valores = [2,7,12,17,22];
const tabela = document.getElementById("minha-tabela");
for(let i = 0; i < coluna_um_valores.length; i++) {
const linha = tabela.insertRow();
const celula1 = linha.insertCell();
const celula2 = linha.insertCell();
celula1.innerHTML = coluna_um_valores[i];
celula2.innerHTML = coluna_dois_valores[i];
}
</script>
Resultado
Espero ter lhe ajudado. Em caso de dúvidas estou à disposição.
Não hesite em voltar ao fórum para continuar aprendendo e interagindo com a comunidade.
Abraços e bons estudos!
Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!