通过JS新增与删除表格中的行
开发工具与关键技术：ASP.NET MVC/JS
作者：郑石秀
撰写时间:3019/3/28
一、新增某一行
下面是我新增表格中某一行的JS代码，先自定义一个方法。方法的名称是随便命名的，再自定义两个变量，这两个变量，一个是获取table中的tr，从而好判断tr有多少行，一个是获取tr的长度,自定义这两个变量的作用是为了新增后单元格中的数字变化。之后再自定义一个变量，这个变量中有一个方法insertRow（）用于在表格的指定位置插入一个空的元素，然后table中一行有多少个单元格就声明多少个变量然后赋值insertCell（）方法用于在 HTML 表的一行的指定位置插入一个空的 元素。
之后如下图把tr行中的td单元格中的内容通过获取元素内容的最简单方法是使用 innerHTML 属性，最后把这个方法通过onclick加载一个新增的方法。
在这里插入图片描述
二、删除行
删除一行单元格的JS代码更加的简单，首先自定义一个删除的方法，在这个方法中加一个自定义的参数，然后再自定义两个变量，一个变量是通过parentNode获取到table，另一个通过parentNode获取到tr,之后通过一个方法removeChild从table中删除当前元素所在的行，再通过onclick加载一个删除的方法，这个删除的方法的中要添加一个this，是为了获取当前的信息。
三、总结
我在写JS代码的过程中出了几个bug，一个是新增，删除的方法是不能在JS加载页面的代码中封装的，不然封装的方法使用onclick加载会调用不了这个方法，把这个方法放到JS加载事件外就可以使用了。另一个是调用方法时"shanChu(this)"中的this是不能用自定义的参数的，使用自定义参数会调用不到这个方法。