コードが行をテーブルに追加しない（HTML/JavaScript）

Question

私は自分のWebサイトで作業しています.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が "games"です。コード：

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

何らかの理由で、コードはテーブルに行を追加しません。私は、コードがロードされたときにコードが実行されていることをテストしました（コードの先頭に警告（ "hi！"）を入れて働かせました）。私は何が間違っているのか分かりません...

Answer 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); 
} 

Answer 2

私は問題を解決しました。私は頭のタグにあったので、テーブルの後にスクリプトを置く！答えをありがとう！