zoukankan      html  css  js  c++  java
  • javascript实现的动态添加表单元素input,button等(appendChild)

    写一个小系统时,需要动态添加表单元素,按自己的实现方法写了这篇教程!
    我想各位在很多网站上都看到过类似的效果!
    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> 
  • 相关阅读:
    [最新]制作u盘引导安装ubuntu11.04
    js记录
    下面的代码有什么不妥之处
    Oracle常用命令
    蓝天下,献给你,html5
    无意义的小东西
    sql中,把varchar类型转换为int型,然后进行排序
    身边的人,来来去去
    不一定能写出来的求素数问题
    写在第一百篇博客之际
  • 原文地址:https://www.cnblogs.com/firstdream/p/4518879.html
Copyright © 2011-2022 走看看