极客观点
项目管理
HarmonyOS
请问如何使添加后的子元素（tr）也能在鼠标经过前后继续保留其存在的子元素上的属性？
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>dom的基础应用</title>
</head>
<script type="text/javascript">
window.onload=function ()
{
var otr=document.getElementsByTagName('tr');
for(var i=0;i<otr.length;i++)
{
bgcChange(otr[i]);
}
}
function bgcChange(obj)
{
obj.onmouseover=function ()
{
obj.style.backgroundColor="#f2f2f2";
}
obj.onmouseout=function ()
{
obj.style.backgroundColor="#ffffff";
}
}
function add()
{
var otr=document.getElementsByTagName('tr');
var tr=document.createElement('tr');
var id=document.createElement('td');
var name=document.createElement('td');
var del=document.createElement('td');
var tab=document.getElementById('table');
if(otr.length<=1)
{
tab.appendChild(tr);
id.innerHTML="xh00"+otr.length;
name.innerHTML="这是第"+otr.length+"个学生";
del.innerHTML="<a href='javascript:;' onclick='del(this)'>删除</a>";
tab.appendChild(tr);
tr.appendChild(id);
tr.appendChild(name);
tr.appendChild(del);
}
else
{
var num=otr.length-1;
num++;
tab.appendChild(tr);
id.innerHTML="xh00"+num;
name.innerHTML="这是第"+num+"个学生";
del.innerHTML="<a href='javascript:;' onclick='del(this)'>删除</a>"
tr.appendChild(id);
tr.appendChild(name);
tr.appendChild(del);
}
}
function del(obj)
{
var a=obj.parentNode.parentNode;
a.parentNode.removeChild(a);
}
</script>
<body>
| 学号 | 姓名 | 操作 |
|---|---|---|
| xh001 | 王小明 | 删除 | <!--在删除按钮上添加点击事件 -->
| xh002 | 刘小芳 | 删除 | <!--在删除按钮上添加点击事件 -->
<input type="button" value="添加一行" onclick="add()" /> <!--在添加按钮上添加点击事件 --></body>
</html>
