                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript进阶篇

为啥我添加的行与列没有table的边框呢？

<!DOCTYPE html>

<html>

<head>

<title> new document </title>

window.onload = function(){

// 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改

}

// 编写一个函数，供添加按钮调用，动态在表格的最后一行添加子节点；

function add()

{

var j=1;

var y=document.createElement("tr");

var z1=document.createElement("tb");

z1.innerHTML="xh00"+j;

var z2=document.createElement("tb");

z2.innerHTML="唐嫣"+j+"号";

var z3=document.createElement("tb");

z3.innerHTML="<a href='javascript:;' onclick='datle(this)'>删除</a>";

var x=document.getElementById("table");

x.appendChild(y);

y.appendChild(z1);

y.appendChild(z2);

y.appendChild(z3);

}

// 创建删除函数

function datle(th)

{

var x=th.parentNode.parentNode;

x.parentNode.removeChild(x);

}

</script>

</head>

<body>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

</body>

</html>

等風來丶

2016-01-07

源自：JavaScript进阶篇 9-22

关注问题我要回答

1103

操作

收起

2 回答

伊望岁月
2016-01-07

你对新加的行和列审查元素会发现，新加的行和列加到了tbody的外面，这是因为表格生成的时候会自动加上tbody标签包着行和列，而你用table标签操作节点，所以不对

<tbody><tr>
    <th>学号</th>
    <th>姓名</th>
    <th>操作</th>
     </tr>
     <tr>
    <td>xh001</td>
    <td>王小明</td>
    <td><a href="javascript:;" onclick="datle(this)">删除</a></td>   <!--在删除按钮上添加点击事件  -->
     </tr>
     <tr>
    <td>xh002</td>
    <td>刘小芳</td>
    <td><a href="javascript:;" onclick="datle(this)">删除</a></td>   <!--在删除按钮上添加点击事件  -->
     </tr>
</tbody>
<tr><tb>xh001</tb><tb>唐嫣1号</tb><tb><a href="javascript:;" onclick="datle(this)">删除</a></tb></tr>