使用jquery生成10x10表

我想用jQuery創建一個簡單的10x10表，這個代碼有什麼問題？它創建這個（我還沒有添加TBODY，我不knwo爲什麼它的存在）使用jquery生成10x10表

<table id="game_table" border="1"> 
<tbody> 
<tr></tr> 
<tr></tr> 
<tr></tr> 
<tr></tr> 
<tr></tr> 
<tr></tr> 
<tr></tr> 
<tr></tr> 
<tr></tr> 
<tr></tr> 
</tbody> 
<td>alma</td> 
... 
<td>alma</td> 
</table>

繼承人的代碼：

 var $game_table = $("#game_table"), 
     init = function(){ 
      for(var i = 0; i < 10; ++i){ 
       $game_table.append("<tr>"); 
       for(var j = 0; j < 10; ++j){ 
        $game_table.append("<td>alma</td>"); 
       } 
       $game_table.append("</tr>"); 
      } 
     };

編輯：謝謝你的答案的傢伙，但我可以使用JavaScript來製作表格，我只是真的感嘆爲什麼這段代碼不起作用，所以請給我一個解決方案。

來源

2013-05-15 Ferenc Dajka

你還沒有提到你看到了什麼樣的錯誤？ –

有沒有錯誤我想得到10 與10在裏面，現在我得到10 THAN 100 –

我更喜歡這樣做。我認爲它會解決你的問題。

for(var i = 0; i < 10; ++i){ 
    var tr = "<tr>"; 
    for(var j = 0; j < 10; ++j){ 
     tr += "<td>alma</td>"; 
    } 
    tr += "</tr>"; 
    $game_table.append(tr); 
}

但你也<tbody>後追加，也許應該把它放在裏面<tr>。

來源

2013-05-15 23:02:16

是的，這是好的，但浪費內存，無論如何，我應該能夠添加和刪除單元格/行後，所以我'd想知道爲什麼這不起作用 –

試試我的方式。你會在''裏看到你的''。 –

你可以做

 var $game_table = $("#game_table"); 
     for(var i = 0; i < 10; ++i){ 
      var tr=$("<tr></tr>"); 
      $game_table.append(tr); 
      for(var j = 0; j < 10; ++j){ 
       tr.append("<td>alma</td>"); 
      } 

     }

jsfiddle

來源

2013-05-15 23:15:06

最有效的方式做到這一點是與普通的JS，它並不難：

var gt = document.getElementById('game_table'), 
    i = 0, 
    frag = document.createDocumentFragment(), 
    tr = document.createElement('tr'), 
    td = document.createElement('td'); 

while (i<10) { 
    var _tr = tr.cloneNode(), 
     j = 0; 
    while (j<10) { 
     _tr.appendChild(td.cloneNode()); 
     j++; 
    } 
    frag.appendChild(_tr); 
    i++; 
} 

gt.appendChild(frag);

FIDDLE

來源

2013-05-15 23:17:59 adeneo

很高興看到有人使用片段而不是直接在DOM上工作 – michael

-1

OK解決方案非常簡單，我將TD-S附加到了桌面上TR-s

來源

2013-05-16 08:54:17