请问一下,不能删除,帮忙解释并给予正确方法,谢谢!
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
/*tr:hover{background:#777;}*/
a{text-decoration:none;}
table,td{
border:1px solid goldenrod;
text-align:center;
}
th{
background-color:sandybrown;
}
table{
margin:15px 0;
width:500px;
height:150px;
}
th,td{
height:30px;
}
button{border:0 yellow none;height:35px;width:100px;font-size:14px;font-weight:bold;}
</style>
<script>
//鼠标滑入滑出事件,获取行
function tabl(){
var trline=document.getElementsByTagName("tr");
for (var i=1; i<trline.length;i++)
{
trline[i].onmouseover=function(){
//通过for循环遍历使每一个trline[i].onmouseover的都有这个function方法,
//this表示把style样式传递给function(),并赋值给trline[i].onmouseover;
this.style.backgroundColor="#f2f2f2";
}
trline[i].onmouseout=function() {
this.style.backgroundColor="#fff";
}
}
}
//添加行
// var itable=document.getElementsByTagName("table");
// 这里是数组,应该加入访问数组内的下标,如:[0](表示读取第一个节点)或使用.lastChild(最后一个节点)
function addtr(){
var tablein=document.getElementById("table");
var newtr=document.createElement("tr");
var newtd=document.createElement("td");
var alink=document.createElement("a");
alink.setAttribute("href","javascript:deleteRow()");
alink.innerHTML="del";
newtd.appendChild(alink);
for (var x=1;x<5;x++){
newtr.appendChild(document.createElement("td"));
}; //添加 “4个” 空白单元格
newtr.appendChild(newtd); //添加以上的第5个 “alink链接与内容” 单元格
tablein.appendChild(newtr);
tabl();
}
//同样td方法,为每一个alink加入链接
var a_btn=document.getElementsByTagName("a");
for (var i=0;i<a_btn.length;i++){
a_btn[i].setAttribute("href","deleteRow(this)");
}
//删除行
function deleteRow(obj){
var getNode = document.getElementById('table');
var deltr = obj.parentNode.parentNode;
getNode.removeChild(deltr);
}
//删除对应
//全部删除
//删除指定
//删除选中
</script>
</head>
<body>
<!--<div>-->
<table id="table">
<tr>
<th>工号</th>
<th>姓名</th>
<th>职务</th>
<th>工资</th>
<th>操作</th>
</tr>
<tr>
<td>138</td>
<td>alex</td>
<<td>iway</td>
<td>12</td>
<td><a href="javascript:">del</a></td>
</tr>
<tr>
<td>4405</td>
<td>hong</td>
<<td>hr</td>
<td>12</td>
<td><a href="javascript:">del</a></td>
</tr>
<<tr>
<td>123</td>
<td>wang</td>
<td>it</td>
<td>12</td>
<td><a href="javascript:">del</a></td>
</tr>
</table>
<button onclick="javascript:addtr();">添加一行</button>
<!--</div>-->
</body>
</html>