<!DOCTYPE HTML PUBliC "-//W3C//DTD xhtml 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Transitional.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv="Content-Type" content="text/HTML; charset=utf⑻" />
<Title>无标题文档</Title>
<script type="text/JavaScript">
window.onload=function(){
var otab=document.getElementByID('tab1');
var obtn=document.getElementByID('btn1');
var oname=document.getElementByID('name');
var oage=document.getElementByID('age');
var ID=otab.tBodIEs[0].rows.length+1;
obtn.onclick=function(){
var otr=document.createElement('tr');
var otd=document.createElement('td');
otd.INNERHTML=ID++;
otr.appendChild(otd);
var otd=document.createElement('td');
otd.INNERHTML=oname.value;
otr.appendChild(otd);
var otd=document.createElement('td');
otd.INNERHTML=age.value;
otr.appendChild(otd);
var otd=document.createElement('td');
otd.INNERHTML='<a href="JavaScript:;">删除</a>';
otr.appendChild(otd);
otd.getElementsByTagname('a')[0].onclick=function(){
otab.tBodIEs[0].removeChild(this.parentNode.parentNode);
};
otab.tBodIEs[0].appendChild(otr);
};
};
</script>
</head>
<body>
姓名：<input ID="name" type="text"/>
年龄：<input ID="age" type="text"/>
<input ID="btn1" type="button" value="添加"/>
<table ID="tab1" border="1" wIDth="500">
<thead>
<td>ID</td>
<td>姓名</td>
<td>年龄</td>
<td> *** 作</td>
</thead>
<tbody>
<tr>
<td>1</td>
<td>he</td>
<td>20</td>
<td></td>
</tr>
<tr>
<td>2</td>
<td>ye</td>
<td>21</td>
<td></td>
</tr>
<tr>
<td>3</td>
<td>echo</td>
<td>20</td>
<td></td>
</tr>
</tbody>
</table>
</body>
</HTML> 总结
以上是内存溢出为你收集整理的js *** 作表格-添加与删除全部内容，希望文章能够帮你解决js *** 作表格-添加与删除所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）