首页 > 移动平台 > 详细

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

时间:2015-05-21 10:38:36      阅读:234      评论: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
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!