下面是本人做的一个简单的新增和删减行数据的方法
html样式:
这是css样式,就一些宽高和背景颜色什么的,可以自己定义。
下面是JS代码
首先获取表格的id、加减按钮的id、给两个按钮添加点击事件(点击事件由后面写完点击事件的方法后添加)
声明一个方法zj,添加表格行时调用并获取元素(标签)td,声明了5个变量接收td标签
用这5个变量接受页面td的值,”javascript:;“防止点击后返回顶部
定义有个变量ntr,获取到行,然后用appendChild这个方法在tr标签后面添加前面定义好了的td数据,实现点击加号新增一行的目的
定义一个删除的方法,这里的obj是自定义的量,它输出的结果是一行末尾的减号,然后再声明2个变量,其中第一个变量获取到的是table标签,因为减号所在的节点的a标签,.parentNode获取到的是td标签,.parentNode.parentNode获取到的是tr标签,.parentNode.parentNode.parentNode获取到的是table标签,同理,声明另一个变量,获取到table标签中的tr标签,tr代表的是一行,所以one.removeChild(two)就是删除一行,然后用减号调用这个方法实现删除一行的方法。
js增减行数据
最新推荐文章于 2022-10-20 16:14:24 发布