<!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 trobj=document.getElementsByTagName("tr"); for (var i=0;i<trobj.length;i++){ trobj[i].onmouseover=function(){ this.style.backgroundColor="#f2f2f2"; } trobj[i].onmouseout=function(){ //this.removeAttribute("style"); this.style.backgroundColor="#fff"; } } } // 编写一个函数,供添加按钮调用,动态在表格的最后一行添加子节点; function addstu(){ var newnode=document.createElement("tr"); var newnode1=document.createElement("td"); var newnode2=document.createElement("td"); var newnode3=document.createElement("td"); var tablenode=document.getElementById("table"); newnode1.innerHTML="xh003"; newnode2.innerHTML="小红"; newnode3.innerHTML="<a href="javascript:;" onclick="remove(this)" >删除</a>"; tablenode.appendChild(newnode); newnode.appendChild(newnode1); newnode.appendChild(newnode2); newnode.appendChild(newnode3); } // 创建删除函数 function del(obj){ var delnode=obj.parentNode.parentNode; delnode.parentNode.removeChild(delnode); } </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="addstu()" /> <!--在添加按钮上添加点击事件 --> </body> </html>
总共三个事件(添加行,删除行,鼠标移动响应),点击后都没有反应,对照其他同学的代码也进行了一些改正还是没有解决,求教怎么解决?
stone310
新添加的行点击删除就会删除整个表格,什么鬼?
请问大神!!!返回删除节点及其内容并使得p元素内容得到响应的变化
怎样才可以把刚建立的表格也可以鼠标移动改变背景
关于删除节点问题