<html>
<head>
<title> new documents </title>
<meta http-equiv='content-Type' content = 'text/html; charset =utf-8' />
<script type ='text/javascript'>
function addOne(obj){
var tbody = documents.getElemenById('table').lastChild;
var tr = document.createElement('tr');
var td = document.createElement('td');
td.innerHTML = "<input type = 'text'/>";
tr.appenChild(td);
td = document.createElement('td');
td.innerHTML="<input type='text'/>";
tr.appendChild(td);
td = document.createElement('td');
td.innerHTML= "<a href = 'javascript:;' onclick = 'deleteRow(this)'>删除</a>";
tr.appenChild(td);
tbody.appenChild(tr);
Highlight();
}
function deleteRow(obj){
var tbody = document.getElemenById('table').lastChild;
var tr = obj.parentNode.parentNode;
tbody.removeChild(tr);
}
function Highlight(){
var body= document.getElemenById('table').lastChild;
trs = tbody.getElemenByTagName('tr')
for (var i =1;i<trs.length;i++){
trs[i].onmouseover=function(){
this.style.backgroundColor='#c00';
}
trs[i].onmouseout =function(){
this.style.backgroundColor='#fff';
}
}
}
</script>
</head>
<body>
<table border= '1' width ='50%' id ="table" onmouseover='Highlight()'>
<tr>
<th>学号</th>
<th>姓名</th>
<th>操作</th>
</tr>
<tr>
<td>xh001</td>
<td>王小明</td>
<td><a href = 'javascript:;' onclick="deleteRow(this)"> 删除</a><td>
</tr>
<tr>
<td>xh002</td>
<td>刘小芳</td>
<td><a href= 'javascript:;' onclick ="deleteRow(this)">删除</a></td>
</tr>
</table>
<input type='button' value="添加一行" onclick = "addOne()"/>
</body>
</html>
