原生JS关于表单的增删查

一、增添元素

在增添元素的时候，我们可以考虑到节点的方式来增添：

1.创建一个新的元素

2.输入新建元素的内容

3.向已有元素追加新元素

有了这三点之后呢你便可以增添一个新元素了，快试试吧！

e.g：

     

二、删除元素

当然，在我们删除某一个选定的元素的时候，我们还是会用到节点，在此就要好好缕一缕子节点和父节点之间的关系了。

在这里，针对于未来事件，其实还有一个方法是可以用的，就是事件委托，但是便于理解，就先看看父子节点的用法吧！

1.写出删除子节点的函数

2.创建一个便于触发事件的函数

首先创建一个自命名的删除函数，设置一个形参在小括号内，因为是要删除table中的tr，但是点击的按钮只能位于某一个tr的td中，所以首先要找到点击按钮的父元素的父元素的父元素，也就是table,然后来删除table中的某个指定的tr（也就是oThis.parentNode.parentNode）,这样一个删除函数就写好了，然后再在input中设置οnclick="del(this)"就好了。

三、保存（查找）元素

1.编写函数

首先，我们要编写一个自命名的函数，然后用alert弹出弹框来显示信息，那么怎么获取表单的文本内容呢？一起来看看吧！

2.利用节点来获取文本value

先来看一段代码吧：

一般我们要获取input文本的内容，都会先在input中加一个id，例如id="aaa",然后在js中获取input的id      var one=document.getElementById("aaa");

然后在用one.value获取文本内容。但是此时我们面临的是一个未来元素，它需要动态的操作，用id的办法很难实现。这时候，我们可以仿照上面的删除，运用父子节点来进行获取。

下面是整个代码，大家可以进行参考：

姓名	性别	年龄	科目	请选择

以上仅供参考！