您好,欢迎来到化拓教育网。
搜索
您的当前位置:首页JavaScript--删除Table中当前行

JavaScript--删除Table中当前行

来源:化拓教育网

HTML代码:

<body>
        <table border="1" width="1000" height="200">
            <tr>
                <td>测试</td>
                <td>测试</td>
                <td>测试</td>
                <td>操作</td>
            </tr>
            <tr>
                <td>测试</td>
                <td>测试</td>
                <td>测试</td>
                <td>
                    <a href="javascript:;" onclick='{if(confirm("确定要删除吗?")) {deleteTr(this); }else {}}'>删除</a>
                </td>
            </tr>
            <tr>
                <td>测试</td>
                <td>测试</td>
                <td>测试</td>
                <td>
                    <a href="javascript:;" onclick='{if(confirm("确定要删除吗?")) {deleteTr(this); }else {}}'>删除</a>
                </td>
            </tr>
            <tr>
                <td>测试</td>
                <td>测试</td>
                <td>测试</td>
                <td>
                    <a href="javascript:;" onclick='{if(confirm("确定要删除吗?")) {deleteTr(this); }else {}}'>删除</a>
                </td>
            </tr>
        </table>
    </body>

Js代码:

<script src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
    //obj是点击行的this
    function deleteTr(obj) {
        //通过this找到父级元素节点
        var tr = obj.parentNode.parentNode;
        //找到表格
        var tbody = tr.parentNode;
        //删除行
        tbody.removeChild(tr);
        //只剩行首时删除表格
        if (tbody.rows.length == 1) {
            tbody.parentNode.removeChild(tbody);
        }
    }
</script>

 

转载于:https://www.cnblogs.com/dcy521/p/11390272.html

因篇幅问题不能全部显示,请点此查看更多更全内容

Copyright © 2019- huatuo9.cn 版权所有 赣ICP备2023008801号-1

违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务