zoukankan      html  css  js  c++  java
  • 原生js实现动态删除表格的一行

    <!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
        <style>
            table {
                 300px;
                height: 300px;
                border: 1px solid black;
            }

            td {
                border: 1px solid black;
                text-align: center;
            }
        </style>
    </head>

    <body>

    </body>

    </html>
    <script>
        var otable = document.createElement("table");//创建table
        document.body.appendChild(otable);
        for (var i = 1; i <= 3; i++) {
            var otr = document.createElement("tr");//创建三个tr
            otable.appendChild(otr);//将tr添加到table中
            for (var j = 1; j <= 3; j++) {
                var otd = document.createElement("td");//创建三个td
                otr.appendChild(otd);//将td添加到tr中
                otd.innerHTML = parseInt(Math.random() * 99);//td内容设置为随机数
            }
            var d = document.createElement("td");//创建td
            otr.appendChild(d); 添加到Tr中
            d.innerHTML = "删除";
            d.onclick = function () {
                this.parentNode.remove();//点击删除
            }

        }
    </script>
  • 相关阅读:
    jenkins 使用oclint 扫描 oc 代码
    mac下 jenkins 环境搭建
    jenkins 中 Poll SCM 和 Build periodically 的区别
    表单验证封装,一招学会,永远受用
    浅谈js中的执行环境和执行环境对象
    浅谈php之设计模式基础
    四条地铁线带你通往Ajax的大门
    论js结合数学的应用
    以留言本的开发打开ajax的世界
    初步学习css3之3D动画
  • 原文地址:https://www.cnblogs.com/bwnnxxx123/p/12988073.html
Copyright © 2011-2022 走看看