通过javascript添加一行

来源:互联网 发布:sybase数据库用的多吗 编辑:程序博客网 时间:2024/05/17 01:02

<html>
<head>
<title>添加新的行</title>
</head>
<body>
<div onclick="addTr()">添加</div>
<table id="myTable" border="1">
<input type="hidden" value="0" id="myInput"/>
<tr id="myTr0">
<td>姓名</td>
<td>性别</td>
<td>操作</td>
</tr>
</table>
</body>
</html>

<script>
/**
 * 添加一行
*/
function addTr(){
var tab = document.getElementById("myTable");
var rowNum = tab.rows.length;

var myInput=document.getElementById("myInput").value;
myInput=parseInt(myInput)+1;
document.getElementById("myInput").value=myInput;

var newTr = tab.insertRow();//生成一个新的行
newTr.id="tr"+myInput;
newTd0=newTr.insertCell(0);//生成一个新的列
newTd0.innerText="AAAA";
newTd1=newTr.insertCell(1);
newTd1.innerText="男";
newTd2=newTr.insertCell(2);
newTd2.innerHTML="<span onclick=delRow(this)>删除"+myInput+"</span>";

document.getElementById("myTable").lastChild.appendChild(newTr); //添加到表格中
}
/**
* 删除一行
*/
function delRow(obj){
var tab = document.getElementById("myTable");
var parNode = obj.parentNode.parentNode.rowIndex;
tab.deleteRow(parNode);//删除一行
}
</script>


<script type="text/javascript"><!--google_ad_client = "ca-pub-1944176156128447";/* cnblogs 首页横幅 */google_ad_slot = "5419468456";google_ad_width = 728;google_ad_height = 90;//--></script><script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
原创粉丝点击