for循环中的HTML表TD无法正确生成

Question

Herro，我正在尝试通过Javascript生成html表，但是输出失败了：

HTML：

<div id="racks" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" style="overflow: auto; display: block; height: 196.8px;" aria-labelledby="ui-accordion-accordion-header-2" role="tabpanel" aria-expanded="true" aria-hidden="false">
<table border="1">
<tbody>
<tr></tr>
</tbody>
</table>
<a onclick="alert(LSZ09 )" href="#">*</a>
<a onclick="alert(LSZ10 )" href="#">*</a>

</div>

使用Javascript：

document.getElementById("racks").innerHTML = "<table border='1'><tbody><tr>";
                        for (var i=0;i<16;i++)
                            {
                            document.getElementById("racks").innerHTML = document.getElementById("racks").innerHTML +"<td><a href='#' onClick='alert('"+jPunten[i].STATDEV+"')'>*</a></td>";
                            }
                            document.getElementById("racks").innerHTML = document.getElementById("racks").innerHTML + "</tr></table>";

Answer 1

您可以在末尾更新#racks元素。 无需每次迭代都更新它。 而且您在onClick事件的引用中遇到了问题

尝试这样的事情：

html = "<table border='1'><tbody><tr>";
for (var i=0;i<16;i++) {
  html += "<td><a href='#' onClick='alert(\""+jPunten[i].STATDEV+"\")'>*</a></td>";
}
html += "</tr></table>";
document.getElementById("racks").innerHTML = html;