表格的控制-删除表格中的任意一行 

<!DOCTYPE html>
<html>
    <head>
        <title>删除表格中的任意一行</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <script type="text/javascript">        
            //为表格删除一行的函数
            function delRow(){
                //获取DOM
                var tbl = document.getElementById('tbl');
                var i = document.getElementById('rowIndex').value;
                //索引要比行号小一
                i--;
                tbl.deleteRow(i);//调用table自带的deleteRow函数删除行
            }            
        </script>    
    </head>
    <body style="text-align:center">
        <p>
            <lable>删除的行号：</label><input type="text" name="rowIndex" id="rowIndex" size="5"/>
            <input type="button" value="删除" onclick="delRow();"/>
        </p>
        <table id="tbl" align="center" border="1">
            <tr>
                <td>col1</td>
                <td>col2</td>
            </tr>
            <tr>
                <td>col11</td>
                <td>col22</td>
            </tr>
            <tr>
                <td>col111</td>
                <td>col222</td>
            </tr>
        </table>
    </body>
</html>

 

posted @ 2016-09-22 21:15  承载梦想-韩旭明  阅读(357)  评论(0)    收藏  举报