<table width="300" border="1">
    <tr>
        <td>1
        </td>
        <td>2
        </td>
        <td>3
        </td>
<td><a href="deleteCurRow();">delete current row</a>
        </td>
    </tr>
    <tr>
        <td>11
        </td>
        <td>22
        </td>
        <td>33
        </td>
<td><a href="deleteCurRow();">delete current row</a>
        </td>
    </tr>
    <tr>
        <td>111
        </td>
        <td>222
        </td>
        <td>333
        </td>
<td><a href="deleteCurRow();">delete current row</a>
        </td>
    </tr>
    <tr>
        <td>1111
        </td>
        <td>2222
        </td>
        <td>3333
        </td>
<td><a href="deleteCurRow();">delete current row</a>
        </td>
    </tr>
</table>
能通过DOM,这样删除当前行吗?怎样通过这个href,找到他的父节点呢?貌似没有parentNode这个属性啊~
帮帮忙呀,谢谢,速度给分

解决方案 »

  1.   

    貌似不可以删除,可以通过jquery的parent()方法获得。
      

  2.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title></head>
    <body>
    <table id="t" width="300" border="1">
        <tr>
            <td>1111</td>
            <td>2222</td>
            <td>3333</td>
            <td><a href="javascript:void(0)" onclick="javascript:deleteCurRow(this);">delete current row</a></td>
        </tr>
        <tr>
            <td>1111</td>
            <td>2222</td>
            <td>3333</td>
            <td><a href="javascript:void(0)" onclick="javascript:deleteCurRow(this);">delete current row</a></td>
        </tr>
        <tr>
            <td>1111</td>
            <td>2222</td>
            <td>3333</td>
            <td><a href="javascript:void(0)" onclick="javascript:deleteCurRow(this);">delete current row</a></td>
        </tr>
        <tr>
            <td>1111</td>
            <td>2222</td>
            <td>3333</td>
            <td><a href="javascript:void(0)" onclick="javascript:deleteCurRow(this);">delete current row</a></td>
        </tr>
    </table>
    <script>function deleteCurRow(ele){
    var t = document.getElementById('t');
    var _parent = ele.parentNode.parentNode;
    t.getElementsByTagName('tbody')[0].removeChild(_parent);

    return false;
    };
    </script>
    </td>
    </body>
    </html>
      

  3.   

    <table width="300" border="1">
        <tr>
            <td>1
            </td>
            <td>2
            </td>
            <td>3
            </td>
            <td><a href="#" onclick="deleteCurRow(event)">delete current row</a>
            </td>
        </tr>
        <tr>
            <td>11
            </td>
            <td>22
            </td>
            <td>33
            </td>
            <td><a href="#" onclick="deleteCurRow(event)">delete current row</a>
            </td>
        </tr>
        <tr>
            <td>111
            </td>
            <td>222
            </td>
            <td>333
            </td>
            <td><a href="#" onclick="deleteCurRow(event)">delete current row</a>
            </td>
        </tr>
        <tr>
            <td>1111
            </td>
            <td>2222
            </td>
            <td>3333
            </td>
            <td><a href="#" onclick="deleteCurRow(event)">delete current row</a>
            </td>
        </tr>
    </table>
    <script>function deleteCurRow(event){
    var r = event.currentTarget.parentNode.parentNode;
    r.parentNode.deleteRow(r.rowIndex);
    }
    </script>
      

  4.   

    IE真是的。。就跟其他浏览器不一样<table width="300" border="1">
        <tr>
            <td>1
            </td>
            <td>2
            </td>
            <td>3
            </td>
            <td><a href="#" onclick="deleteCurRow(event)">delete current row</a>
            </td>
        </tr>
        <tr>
            <td>11
            </td>
            <td>22
            </td>
            <td>33
            </td>
            <td><a href="#" onclick="deleteCurRow(event)">delete current row</a>
            </td>
        </tr>
        <tr>
            <td>111
            </td>
            <td>222
            </td>
            <td>333
            </td>
            <td><a href="#" onclick="deleteCurRow(event)">delete current row</a>
            </td>
        </tr>
        <tr>
            <td>1111
            </td>
            <td>2222
            </td>
            <td>3333
            </td>
            <td><a href="#" onclick="deleteCurRow(event)">delete current row</a>
            </td>
        </tr>
    </table>
    <script>function deleteCurRow(event){
    var r;
    if(document.all){
    r = event.srcElement.parentNode.parentNode;
    }else{
    r = event.target.parentNode.parentNode;
    }

    r.parentNode.deleteRow(r.rowIndex);
    }
    </script>