qq_慕移动6125882
2021-02-15 22:52
<!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 tr=document.getElementsByTagName("tr");
for(var i=0;i<tr.length-1;i++){
bgcChang(tr[i]);
}
// 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
function bacChange(){
obj.onmouseover=function(){
obj.style.backgroundColor="#f2f2f2";
}
obj.onmouseout=function(){
obj.style.backgroundColor="#fff";
}
}
}
// 编写一个函数,供添加按钮调用,动态在表格的最后一行添加子节点;
function add(){
var num=prompt("请输入学号","");
var name=prompt("请输入名字","");
if(num!=null&&num!=" "&&name!=null&&name!=" "){
var newtr=document.createElement("tr");
var newtrs=newtr.innerHTML="<td>"+num+"</td>"+"<td>"+name+"</td>"+'<a href="javascript:;" onclick="del(this)">删除</a>';
var table=document.getElementById("table").lastChild;
table.appendChild(newtr);
}
else{
alert("请重新输入");
}
}
// 创建删除函数
function del(obj){
var oG=obj.parentNode.parentNode.parentNode;
var oP=obj.parentNode.parentNode;
oG.removeChild(oP);
}
</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:;" onclick="del(this)">删除</a></td> <!--在删除按钮上添加点击事件 -->
</tr>
<tr>
<td>xh002</td>
<td>刘小芳</td>
<td><a href="javascript:;" onclick="del(this)">删除</a></td> <!--在删除按钮上添加点击事件 -->
</tr>
</table>
<input type="button" value="添加一行" onclick="add()"> <!--在添加按钮上添加点击事件 -->
</body>
</html>
改变颜色的函数调用错误bgcChang(tr[i]);应该是bacChange(tr[i]);
改变颜色函数里obj没有定义,应该是function bacChange(obj);
改变颜色for循环条件;里应该是i<tr.length;
var name=prompt("请输入名字","");名字后的逗号应该是英文的,你用的是中文的逗号
JavaScript进阶篇
468061 学习 · 21891 问题
相似问题