Seu código originalmente está gerando apenas esta saída: <table><tr>
.
Como você pode perceber, apenas uma pequena parte do seu código estava sendo atribuída à variável results
, isto por que você inicia um for
(que por si só não retorna nada).
Depois que você inicia esta estrutura nada mais é concatenado à results, devido a alguns problemas de "semântica".
Em javascript o ;
pode ser omitido depois de uma quebra de linha, então você não tinha um "erro" de sintaxe com o início do for
e mesmo assim ele era executado sem problema.
Além disto, <tr>
cria uma única linha, aparentemente você precisa criar uma para cada registro do seu JSON, certo? Se sim, você deve concatená-lo em cada iteração do seu for
.
Então, considere alterar de:
var tamanhoJson = json.length;
results =
"<table>"+
"<tr>"
for (var i = 0; i < json.length; i++)
{
+"<td>"+json[i].tamanhoArray + " Elementos</td>"+
"<td>"+json[i].nome + " </td>"+
"<td>"+json[i].tempoNS + " ns</td>"+
"<td>"+json[i].tempoMS + " ms</td>"
}
+"</tr>"+
"</table>"+
"<br />";
Para algo deste tipos:
var tamanhoJson = json.length;
var results = "<table>";
for (var i = 0; i < tamanhoJson; i++) {
results += "<tr>";
results += "<td>" + json[i].tamanhoArray + " Elementos</td>";
results += "<td>" + json[i].nome + " </td>";
results += "<td>" + json[i].tempoNS + " ns</td>";
results += "<td>" + json[i].tempoMS + " ms</td>";
results += "</tr>";
}
results +="</table>";
results += "<br />";
Abaixo um exemplo completo e funcional, veja se é o que você de fato precisa:
<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>
$(document).ready(function() {
var json = [{
"tempoNS": 104095548,
"tempoMS": 104,
"tamanhoArray": 9000,
"nome": "Bubble iterativo"
}, {
"tempoNS": 84671736,
"tempoMS": 84,
"tamanhoArray": 9000,
"nome": "Bubble recursivo"
}, {
"tempoNS": 22793428,
"tempoMS": 22,
"tamanhoArray": 9000,
"nome": "Insertion iterativo"
}, {
"tempoNS": 243897911,
"tempoMS": 243,
"tamanhoArray": 9000,
"nome": "Insertion recursivo"
}, {
"tempoNS": 57896229,
"tempoMS": 57,
"tamanhoArray": 9000,
"nome": "Selection iterativo"
}, {
"tempoNS": 34119355,
"tempoMS": 34,
"tamanhoArray": 9000,
"nome": "Selection recursivo"
}, {
"tempoNS": 6322368,
"tempoMS": 6,
"tamanhoArray": 9000,
"nome": "Merge iterativo"
}, {
"tempoNS": 2057750,
"tempoMS": 2,
"tamanhoArray": 9000,
"nome": "Merge recursivo"
}, {
"tempoNS": 1600741,
"tempoMS": 1,
"tamanhoArray": 9000,
"nome": "Quick recursivo"
}, {
"tempoNS": 2621617,
"tempoMS": 2,
"tamanhoArray": 9000,
"nome": "Heap recursivo"
}, {
"tempoNS": 3081947,
"tempoMS": 3,
"tamanhoArray": 9000,
"nome": "CombSort Sem Otimização"
}, {
"tempoNS": 3163448,
"tempoMS": 3,
"tamanhoArray": 9000,
"nome": "CombSort Com Otimização"
}];
var tamanhoJson = json.length;
var results = "<table>";
for (var i = 0; i < tamanhoJson; i++) {
results += "<tr>";
results += "<td>" + json[i].tamanhoArray + " Elementos</td>";
results += "<td>" + json[i].nome + " </td>";
results += "<td>" + json[i].tempoNS + " ns</td>";
results += "<td>" + json[i].tempoMS + " ms</td>";
results += "</tr>";
}
results +="</table>";
results += "<br />";
var div = document.getElementById("tabelaDinamica2");
console.log(results);
div.innerHTML = results;
});
</script>
<body>
<div id="tabelaDinamica2"></div>
</body>
</html>