javascript如何实现追加或删除表单元素_js里往表单追加项目-CSDN博客

本文链接：https://blog.csdn.net/lijt1987/article/details/4010709

页面的代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Untitled Page</title> <script type="text/javascript"> function add(){ //用于追后input元素的命名 var lastIndex=document.testForm.childNodes.length; //追加段html代码 document.testForm.innerHTML+="<p><input type='text' name='input"+lastIndex+"' /></p>"; } function sub(){ //获取testForm最后一个子节点 var lastChild=document.testForm.lastChild; //如果该子节点的标签名是P //(一般在javascript里标签名都是大写的，<p>里的p就是标签名) //避免"杀错良民"了 if(lastChild.tagName == "P"){ document.testForm.removeChild(lastChild); //移除最后的子节点 } } </script> </head> <body> <a href="javascript:add();">增加</a> <a href="javascript:sub();">减去</a> <form name="testForm"> </form> </body> </html>

在body里写了两个超链接，一个是增加表单元素，一个是减去最后一个的表单元素。

下百介绍一下用到的函数或者对象。

childNodes是子节点的集合

innerHTML是一个HTML元素里面的HTML代码

lastChild是HTML元素的最后一个子节点

除了有lastChild外，还有firstChild，望文生义，这是HTML元素的第一个子节点

removeChild是HTML元素里，删除里面的子节点，参数是一个HTML元素

其实可以由这个扩展很多特效的。

希望这篇文章可以帮到大家。