首页 > web前端 > js教程 > 正文

javascript实现的动态添加表单元素input,button等(appendChild)_javascript技巧

WBOY
发布: 2016-05-16 19:07:37
原创
1393 人浏览过

写一个小系统时,需要动态添加表单元素,按自己的实现方法写了这篇教程!
我想各位在很多网站上都看到过类似的效果!
1、先用document.createElement方法创建一个input元素!

复制代码 代码如下:

var newInput = document.createElement("input"); 

2、设定相关属性,如name,type等 
复制代码 代码如下:

newInput.type=mytype;  
newInput.name="input1"; 

3、用appendChild方法,将元素追加到某个标签内容中!
复制代码 代码如下:

TemO.appendChild(newInput); 

Javascrip核心代码:
复制代码 代码如下:

<script> <BR>function AddElement(mytype){ <BR>var mytype,TemO=document.getElementById("add"); <BR>var newInput = document.createElement("input"); <BR>newInput.type=mytype; <BR>newInput.name="input1"; <BR>TemO.appendChild(newInput); <BR>var newline= document.createElement("br");//创建一个BR标签是为能够换行! <BR>TemO.appendChild(newline); <BR>} <BR></script> 


[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!