代码不会向表中添加行（HTML / JavaScript）[重复]答案

【问题标题】：Code doesn't add rows to table (HTML / JavaScript) [duplicate]代码不会向表中添加行（HTML / JavaScript）[重复]
【发布时间】：2018-02-03 20:29:25
【问题描述】：

我正在我的网站上工作，我想使用 Javascript 制作一个行数等于数组 game_names 长度的表格。整个代码是：

var game_names = [
  "first_game",
  "second_game",
  "third_game",
  "fourth_game",
  "fifth_game"
];

var parent = document.getElementById("games");

for (i=0;i<=10;i++){
    var child = document.createElement("tr");
    var node = document.createTextNode("hi!");
    child.appendChild(node);
    parent.appendChild(child);
}

在 HTML 代码中是一个空表（没有任何单元格），ID 为“游戏”。代码：

<table id="games" border="10px" align="center" width="100px">         
</table>

由于某种原因，代码不会向表中添加任何行。我测试了加载页面时代码是否会运行（我在代码的开头放置了一个警报（“hi！”）并且它起作用了）。我不知道怎么了...

【问题讨论】：

请编辑问题标题。 Something doesn't want to work 既不是描述性的，也对未来的读者没有帮助。
tr 无法显示文本，您需要一个td 元素来添加文本，然后将td 附加到tr。
您需要 <td> 元素，但代码在正确标记的现代浏览器中运行良好：jsfiddle.net/ewp85sz2
刚刚在 Firefox 中进行了测试，它工作正常：/
您检查控制台是否有错误？

标签： javascript html dom html-table parent-child

【解决方案1】：

代码似乎可以工作，但会生成奇怪的 html。行（tr 元素）应包含单元格（td 元素）。而你没有迭代你的 game_names 数组，你只是从 0 迭代到 10。请参阅下面的代码示例。

var game_names = [
  "first_game",
  "second_game",
  "third_game",
  "fourth_game",
  "fifth_game"
];

var parent = document.getElementById("games");


for (i=0;i<=game_names.length;i++){
    var childRow = document.createElement("tr");
    var childCell = document.createElement("td");
    var node = document.createTextNode("hi!");
    childRow.appendChild(childCell);
    childCell.appendChild(node);
    parent.appendChild(childRow);
}

【讨论】：

是的，我改变了迭代 btw，对此感到抱歉

【解决方案2】：

好的，我解决了这个问题。我把脚本放在表格之后，因为它在头标签中！谢谢你的回答！

【讨论】：

你为什么接受了一个当时没有这么说的答案？