<!DOCTYPE html>
<html>
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
<script type="text/javascript">
window.onload = function(){
var hang=document.getElementsByTagName("tr");
for(var i=0;i<hang.length;i++){
hang[i].onmouseover=function(){
this.style.backgroundColor="#f2f2f2";
}
hang[i].onmouseout=function(){
this.style.backgroundColor="#fff";
}
}
}
function add(){
var xh = document.getElementsByTagName("tr");
var xhnum = xh.length;
var hang=document.createElement("tr");
var lie1=document.createElement("td");
lie1.innerHTML = "xh00"+xhnum;
var lie2=document.createElement("td");
var lie3=document.createElement("td");
var link=document.createElement("a");
link.setAttribute("href","javascript:del(1);")
link.innerHTML="删除";
var wai = document.getElementsByTagName("table");
lie3.appendChild(link);
hang.appendChild(lie1);
hang.appendChild(lie2);
hang.appendChild(lie3);
wai[0].appendChild(hang);
}
function del(n){
var a=document.getElementsByTagName("tr");
a[n].parentNode.removeChild(a[n]);
}
</script>
</head>
<body>
<table border="1" width="50%" id="table">
<tr>
<th>学号</th>
<th>姓名</th>
<th>操作</th>
</tr>
<tr>
<td>xh001</td>
<td>王小明</td>
<td><a href="javascript:del(1);" >删除</a></td> <!--在删除按钮上添加点击事件 -->
</tr>
<tr>
<td>xh002</td>
<td>刘小芳</td>
<td><a href="javascript:del(2);" >删除</a></td> <!--在删除按钮上添加点击事件 -->
</tr>
</table>
<input type="button" value="添加一行" onclick="add()" /> <!--在添加按钮上添加点击事件 -->
</body>
</html>
加进去的行好像没有做到换背景，可以直接把window.onload里的执行代码粘到add()最后，也可以这样改
window.onload = change; //函数名自定义
function change(){ //执行代码
}
function add(){ //其他代码
change();
}