在表格的最后一行后面添加一行

完整HTML代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>在第一行前面插入新行</title>
<script>
count = 0;
function insertRowBeforFirst(tableID) {
var table = document.getElementById(tableID);
// 在第一行前面插入新行
var row = table.insertRow(0);
// 给新行插入第一个单元格
var cell1 = row.insertCell(0);
// 给单元格填写内容
cell1.innerHTML = "New_" + count++;
// 给新行插入第二个单元格
var cell2 = row.insertCell(1);
cell2.innerHTML = "New_" + count++;
}
</script>
</head>
<body>
<h2>在表格的第一行前面插入新行</h2>
<table id="myTable" border="1">
<tr>
<td>cell 1</td>
<td>cell 2</td>
</tr>
<tr>
<td>cell 3</td>
<td>cell 4</td>
</tr>
</table>
<br>
<button type="button" onclick="insertRowBeforFirst('myTable')">插入新行</button>
</body>
</html>

详细代码

1
2
3
4
5
6
7
8
9
10
11
12
13
count = 0;
function insertRowBeforFirst(tableID) {
var table = document.getElementById(tableID);
// 在第一行前面插入新行
var row = table.insertRow(0);
// 给新行插入第一个单元格
var cell1 = row.insertCell(0);
// 给单元格填写内容
cell1.innerHTML = "New_" + count++;
// 给新行插入第二个单元格
var cell2 = row.insertCell(1);
cell2.innerHTML = "New_" + count++;
}