<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>javascript實現表格動態增加刪除</title>
<script>
function addline() {
var tb = document.getElementById("mytable");
var row = tb.insertRow(tb.rows.length);
var colname = row.insertCell(row.cells.length);
var colage = row.insertCell(row.cells.length);
var colbutton = row.insertCell(row.cells.length);
colname.innerHTML = document.getElementById("name1").value;
colage.innerHTML = document.getElementById("age1").value;
colbutton.innerHTML = '<input type="button" value="刪除" onclick="deleteRow('
+ (tb.rows.length - 1) + ')" />'
}
function deleteRow(index) {
var tb = document.getElementById("mytable");
tb.deleteRow(index);
}
</script>
<body>
<table id="mytable" border="1">
<tr>
<td>NAME</td>
<td>AGE</td>
<td>OPERATE</td>
</tr>
</table>
<input type="text" name="name" id="name1" />
<input type="text" name="age" id="age1" />
<input type="button" value="PRESS" onclick="return addline();" />
</body>
</html>