JavaScript Dom 案例-动态表格的添加和删除(二)

最新推荐文章于 2023-05-18 13:55:24 发布

OneTheRoad

最新推荐文章于 2023-05-18 13:55:24 发布

阅读量332

点赞数

文章标签： javascript 前端

本文链接：https://blog.csdn.net/ontheroad1024/article/details/103624659

版权

接上篇,这次使用inneHTML达到相同效果,所有都不需要动,只需要把添加那一块最麻烦的代码给他替换掉,如下:

document.getElementById("btn").onclick=function(){
            var id = document.getElementById("id").value;
            var name = document.getElementById("name").value;
            var sex = document.getElementById("sex").value;

        var table=document.getElementsByTagName("table")[0];
            table.innerHTML+="<tr>\n" +
            "        <td>"+id+"</td>\n" +
            "        <td>"+name+"</td>\n" +
            "        <td>"+sex+"</td>\n" +
            "        <td><a href=\"javascript:void(0);\"  onclick=\"delTr(this);\">删除</a></td>\n" +
            "    </tr>";
    }

注意: 这个方法的重点在 table.innerHTML后面这个"+=",需要加等插入.