代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
#product{
background-color: hotpink;
}
table tr td{
padding: 5px 20px;
}
</style>
</head>
<body>
<input type="button" value="添加一行" id="add"/>
<input type="button" value="删除一行" id="devide" /><br />
<table id="tab" border="1px" cellspacing="0" cellpadding="0">
<tr id="product">
<td>商品名称</td>
<td>数量</td>
<td>单价</td>
<td>运费</td>
<td>合计</td>
</tr>
<tr>
<td>鼠标</td>
<td>2</td>
<td>55</td>
<td>10</td>
<td>225</td>
</tr>
</table>
<script type="text/javascript">
var tab_only=document.getElementsByTagName("table");
var addEle=document.getElementById("add");
var devideEle=document.getElementById("devide");
addEle.onclick=function(){
/*添加一行*/
var tr_first=document.createElement("tr");
tab.appendChild(tr_first);
/*5列数据*/
var td1=document.createElement("td");
td1.innerHTML=(tab.children.length)-1;
tr_first.appendChild(td1);
var td2=document.createElement("td");
tr_first.appendChild(td2);
var td3=document.createElement("td");
tr_first.appendChild(td3);
var td4=document.createElement("td");
tr_first.appendChild(td4);
var td5=document.createElement("td");
tr_first.appendChild(td5);
}
</script>
</body>
</html>
重点难点：
td1.innerHTML=(tab.children.length)-1;
显示一行一行，从1开始显示行效果：
513
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
