版權聲明：本文爲博主原創文章，遵循 CC 4.0 BY-SA 版權協議，轉載請附上原文出處鏈接和本聲明。
本文鏈接：https://blog.csdn.net/feng_cs/article/details/2966402
動態地增加一行，或刪除指定的一行。
用到了HTML的DOM對象。
主要是insertRow(), insertCell(), deleteRow()方法的使用。
<html>
<head>
<title>addrow.html</title>
<script type="text/javascript">
var num = 1;
function addRow() {
var tb = document.getElementById("mytableid");
var row = tb.insertRow();
var cell = row.insertCell();
cell.innerText = "第" + num + "行";
num++;
cell = row.insertCell();
cell.innerHTML = "<input type='text' value = '新一行'>";
}
function delRow() {
var rowIndex = document.getElementById("delTextId").value;
var tb = document.getElementById("mytableid");
tb.deleteRow(rowIndex-1);
}
</script>
</head>
<body>
<table id="mytableid">
<!-- <tr><td>第一行</td><td>輸入</td></tr> -->
</table>
<input type="button" value="新增一行" οnclick="addRow()" />
<br>
<input type="text" id="delTextId" />
<input type="button" value="刪除選擇行" οnclick="delRow()" />
</body>
</html>
HTML 中動態增加、刪除行的實現
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章