javascript - 如何使用它的 tds 动态生成表行？

Question

我有一个这样的表:

<table id="myTable" cellspacing="0" cellpadding="10" border="0" width="100%">
<tbody>
....
<tr style="color: blue;" id="bankRecord377">      
  <td align="center" class="styleOdd"> <input type="checkbox" value="377" name="377"></td>
  <td align="center" class="styleOdd">377</td>
  <td align="center" class="styleOdd"></td>
  <td align="center" class="styleOdd">391</td>
</tr>
....
<tr style="color: blue;" id="bankRecord386">     
  <td align="center" class="styleEven"> <input type="checkbox" value="386" name="386"></td>
  <td align="center" class="styleEven">386</td>
  <td align="center" class="styleEven"></td>
  <td align="center" class="styleEven">396</td>
</tr>
...
<tr style="color: blue;" id="bankRecord322">     
  <td align="center" class="styleEven"> <input type="checkbox" value="322" name="386"></td>
  <td align="center" class="styleEven">322</td>
  <td align="center" class="styleEven"></td>
  <td align="center" class="styleEven">314</td>
</tr>
...
</tbody>
</table>

我有一些输入字段，用户在那里插入一些信息。在那之后，我想动态地添加一个 tr 到我的表的顶部。我的意思是我想生成:

<tr style="color: blue;" id="bankRecord310">     
  <td align="center" class="styleEven"> <input type="checkbox" value="310" name="386"></td>
  <td align="center" class="styleEven">318</td>
  <td align="center" class="styleEven"></td>
  <td align="center" class="styleEven">314</td>
</tr>

有310(td 1和td 2唯一)，318和314的信息。你可以为tds设置ids。

我如何动态生成一个表行，其中包含我将设置名称、值等属性的 tds？

Answer 1

一种快速肮脏的方法是使用 jquery prepend() 方法将任何 html 代码插入到 tbody 的顶部，例如

$("#mytable tbody").prepend($("<tr><td>cell1</td><td>cell2</td></tr>"));