在前端開發(fā)過程中，有時我們需要在表格中動態(tài)添加新行。而這種情況下，最常見的做法就是復(fù)制表格中的某一行，然后通過修改其中的一些內(nèi)容，來生成新的表格行。使用 JavaScript 來實(shí)現(xiàn)此功能非常簡單，下面我們來簡要介紹一下。

首先，我們在表格的 HTML 代碼中選擇一行作為模板行，通常情況下，這會是表頭行以下的第一行。我們需要將這一模板行的 HTML 代碼提取出來并先保存到 JavaScript 代碼中。以一個簡單的表格為例：

<table id="my-table">
<thead>
<tr>
<th>姓名</th>
<th>性別</th>
<th>年齡</th>
</tr>
</thead>
<tbody>
<tr>
<td>小明</td>
<td>男</td>
<td>12</td>
</tr>
</tbody>
</table>

上面的代碼中，我們選擇了第二行作為模板行。可以將該行的 HTML 代碼保存到一個字符串變量中：

var templateRowHtml = '<tr><td>小明</td><td>男</td><td>12</td></tr>';

接著，我們可以使用 jQuery 的方法來動態(tài)添加新行。比如，下面的代碼可以在表格中添加一行：

$('#my-table tbody').append(templateRowHtml);

當(dāng)然，我們也可以在添加新行之前，先修改其中的一些內(nèi)容。比如，下面的代碼可以在新行中替換成一個不同的用戶名：

var newRowHtml = templateRowHtml.replace('小明', '小紅');
$('#my-table tbody').append(newRowHtml);

另外，如果我們需要一次性添加多行，可以使用循環(huán)語句來實(shí)現(xiàn)：

for (var i = 1; i<= 10; i++) {
var newRowHtml = templateRowHtml.replace('小明', '用戶' + i);
$('#my-table tbody').append(newRowHtml);
}

上面的代碼可以添加 10 行，其中每一行的用戶名分別為 "用戶1" 到 "用戶10"。

總的來說，使用 JavaScript 復(fù)制表格行非常簡單，只需要從 HTML 中提取出一行作為模板，再通過 jQuery 來添加或修改其中的內(nèi)容即可。如果需要添加多行，可以使用循環(huán)語句來實(shí)現(xiàn)。