问答详情
源自:9-22 编程练习

为什么使用两种删除删除函数时,都会出现以下情况?第一次点击第一行的删除正常删除,第二次无论点第二行还是第三行的删除所有行都被删除;第一次无论点第二行还是第三行的删除,所有行全被删除?(360,chrome,ie下均是如此)

<!DOCTYPE html>

<html>

 <head>

  <title> new document </title>  

  <meta http-equiv="Content-Type" content="text/html; charset=gbk"/>   

  <script type="text/javascript"> 

 // 创建删除函数

    /*第一种删除函数

    function del(obj)

    {

        var tbody=document.getElementById("table").lastChild;

        var tr=obj.parentNode.parentNode;

        tbody.removeChild(tr);

    }

    */

     

     //第二种删除函数

     function del(obj)

     {

         var tr=obj.parentNode.parentNode;

         var tb=tr.parentNode;

         tb.removeChild(tr);

     }


 </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);return false;" >删除</a></td>   <!--在删除按钮上添加点击事件  -->

   </tr>


   <tr>

<td>xh002</td>

<td>刘小芳</td>

<td><a href="javascript;" onclick="del(this)" >删除</a></td>   <!--在删除按钮上添加点击事件  -->

   </tr> 

   

   <tr>

<td>xh003</td>

<td>aa</td>

<td><a href="javascript;" onclick="del(this)" >删除</a></td>   <!--在删除按钮上添加点击事件  -->

   </tr> 


   </table>

   <input type="button" value="添加一行" onclick="add()" />   <!--在添加按钮上添加点击事件  -->

 </body>

</html>



提问者:littlegeezer 2018-11-12 20:03

个回答

  • littlegeezer
    2018-11-12 21:31:27

    自己找了一个小时搞明白原因了,第二行和第三行的a href="javascript;"中javascript后误删了冒号