Не работает заполнение таблицы
Фрагмент кода:
<table id="tbl"></table>
<script>
for(var i = 0; i < 10; i++){
tbl.innerHTML += "<tr>";
for(var j = 0; j < 50; j++){
tbl.innerHTML += "<td> </td>";
}
tbl.innerHTML += "</tr>";
}
</script>
Таблицу заполняет так:
<tr></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr><tr><td> </td></tr>...
А должен так:
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
...
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
...
</tr>...
Ответы (2 шт):
Автор решения: Igor
→ Ссылка
Не добавляйте незаконченный html в таблицу. Браузер сам закрывает незакрытый tr.
var rows = "";
for(var i = 0; i < 10; i++){
rows += "<tr>";
for(var j = 0; j < 50; j++){
rows += "<td> </td>";
}
rows += "</tr>";
}
tbl.innerHTML = rows;
Автор решения: Deonis
→ Ссылка
В чём была ваша ошибка, уже подсказал @Igor, а я просто дам альтернативный вариант:
tbl.innerHTML = `<tr>${`<td> </td>`.repeat(50)}</tr>`.repeat(10);