关于Chrome中JS的Uncaught Error: NOT_FOUND_ERR: DOM Exception 8问题

时间:2022-11-20 20:29:10

今天使用table.removeChild(tr)去删除table下的某一行,竟然失效了。代码示例如下:

<table id="tbl">
<tr id="row1"><td>row1</td></tr>
<tr id="row2"><td>row2</td></tr>
<tr id="row3"><td>row3</td></tr>
<tr id="row4"><td>row4</td></tr>
<tr id="row5"><td>row5</td></tr>
</table>
<button onclick="javascript:deleteChild()">delete</button>
<script type="text/javascript">
    function deleteChild(){
        var tbl=document.getElementById("tbl");
        var row=document.getElementById("row1");
        tbl.removeChild(row);
    }
</script>

在Chrome捕获的异常为:Uncaught Error: NOT_FOUND_ERR: DOM Exception 8

原来,规范的html中,<table>的子元素并不是<tr>,而是<tbody>,只不过浏览器都没有严格要求一定要将<tr>放在<tbody>中,所以一般都没什么问题,但使用table.removeChild(node),删除的却应该是tbody元素,而实际上,就算不加<tbody>元素,<tr>元素的parentNode都是<tbody>,而不是<table>(在chrome,IE9,FF下是,其他浏览器就没有试过。)

所以改为tbody.removeChild(tr),就可以了。