テーブルを反復する行を取得できません

Question

私はjavascriptの新機能ですので、これは本当にダムです...しかし、私はなぜ新しいテーブル行を垂直に配置するスクリプトを取得できないのか分かりません。このコードは最初の行と一緒に水平にすべての新しい行を追加するようです。

function genGameGrid(){ 
var rows=10, columns=10; 
var x = document.createElement("TABLE"); 
x.setAttribute("id", "myTable"); 
document.body.appendChild(x); 

    for(var i=0;i<=rows;i++){ 
     var y = document.createElement("TR"); 
     y.setAttribute("id", "myTr", i); 
     document.getElementById("myTable").appendChild(y); 
     for(var j=0;j<=columns;j++){ 
      var z = document.createElement("TD"); 
      var t = document.createTextNode(j); 
      z.appendChild(t); 
      document.getElementById("myTr").appendChild(z); 
     } 
    } 
} 

var yの属性を設定することと関係がありますが、考えていないと思います。

助けを借りて、私はどこがうんざりしているかを知った。ここでは機能コードは次のとおりです。

function genGameGrid(){ 
var rows=10, columns=10; 
var table = document.createElement("TABLE"); 
document.body.appendChild(table); 

for(var i=0;i<=rows;i++){ 
    var row = document.createElement("TR"); 
    table.appendChild(row); 

    for(var j=0;j<=columns;j++){ 
     var cell = document.createElement("TD"); 
     var text = document.createTextNode(""); 
     cell.appendChild(text); 
     row.appendChild(cell); 
    } 

}
}

Answer 1

.setAttributeは、3つのパラメータを受け付けません。

y.setAttribute("id", "myTr", i); 

あなたはおそらく2つの値を連結しようとしていますか？

y.setAttribute("id", "myTr" + i); 

また、横の行はありません。 myTr属性を持つ最初の行にすべてのセルを追加しています！同じid属性を持つ行を生成していて、.getElementByIdが最初に一致する要素を返します。

要素に属性を追加し、同じ要素をIDで取得するためにDOMを照会する必要はありません。考え直してください。 yは、現在の行を参照します。

y.appendChild(z);