html5中文学习网

您的位置: 首页 > 网站及特效实例 > javascript特效 » 正文

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

[ ] 已经帮助:人解决问题
写一个小系统时,需要动态添加表单元素,按自己的实现方法写了这篇教程!
我想各位在很多网站上都看到过类似的效果!
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 language="javascript"> 
function AddElement(mytype){ 
var mytype,TemO=document.getElementById("add"); 
var newInput = document.createElement("input");  
newInput.type=mytype;  
newInput.name="input1"; 
TemO.appendChild(newInput); 
var newline= document.createElement("br");//创建一个BR标签是为能够换行! 
TemO.appendChild(newline); 

</script> 


[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助