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> 
  • 相关阅读:
    JAVA 优先获取外网Ip,再获取内网Ip
    session 关于localhost和本地IP地址 不共享问题
    读取properties的简单方法,使用@Configuration
    数组和工具类练习
    for循环练习题
    eclipse 的输入输出练习
    用eclispe练习常、变量数据类型之间的转换
    第一个java小程序
    Java基础理论(1)
    字符集
  • 原文地址:https://www.cnblogs.com/firstdream/p/4518879.html
Copyright © 2011-2022 走看看