<html>
<div class='add'>
名字: <input type="" name="">年龄:<input type="" name=""><input type="button" value='add'>
</div>
<table id="tb">
<tbody>
<tr><td>赵</td><td>11</td><td><button>删除</button></td></tr>
<tr><td>钱</td><td>22</td><td><button>删除</button></td></tr>
<tr><td>孙</td><td>33</td><td><button>删除</button></td></tr>
<tr><td>李</td><td>44</td><td><button>删除</button></td></tr>
<tr><td>周</td><td>55</td><td><button>删除</button></td></tr>
</tbody>
</table>
<script>
var tbody=document.getElementsByTagName('tbody')[0];
function color(){
var tr=document.getElementsByTagName('tr');
for(var i=0;i<tr.length;i++){
if(i%2==0){
tr[i].setAttribute('class','odd')
}else{
tr[i].setAttribute('class','even')
}
}
}
function remove(){
var child=tbody.children[0];
var son=child.children;
var button=document.getElementsByTagName('button');
for(var i=0;i<button.length;i++){
button[i].onclick=function(){
var thistr=this.parentNode.parentNode;
color()
tbody.removeChild(thistr)
}
}
color();
}
remove()
function add(){
var input=document.getElementsByTagName('input');
input[2].onclick=function(){
var name=input[0].value;
var age=input[1].value;
var name1=document.createTextNode(name);
var age1=document.createTextNode(age);
var but_=document.createTextNode('删除')
var tr=document.createElement('tr');
var td1=document.createElement('td');
var td2=document.createElement('td');
var td3=document.createElement('td');
var but=document.createElement('button');
td1.appendChild(name1);
td2.appendChild(age1);
but.appendChild(but_)
tbody.appendChild(tr).appendChild(td1);
tbody.appendChild(tr).appendChild(td2);
tbody.appendChild(tr).appendChild(td3).appendChild(but)
remove()
color()
}
}
add()