码迷,mamicode.com
首页 > 移动开发 > 详细

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

时间:2015-05-21 10:40:11      阅读:158      评论:0      收藏:0      [点我收藏+]

标签:

写一个小系统时,需要动态添加表单元素,按自己的实现方法写了这篇教程!
我想各位在很多网站上都看到过类似的效果!
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> 
 
 
写一个小系统时,需要动态添加表单元素,按自己的实现方法写了这篇教程!
我想各位在很多网站上都看到过类似的效果!
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> 

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

标签:

原文地址:http://www.cnblogs.com/firstdream/p/4518879.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!