版权声明:本文为博主原创文章,遵循 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 中动态增加、删除行的实现
猜你喜欢
转载自blog.csdn.net/weixin_41926640/article/details/100155293
今日推荐
周排行