• DOM之练习2


    <!DOCTYPE html>
    <!--
    需求
        1.点击“添加附件”按钮,出现一个添加附件的input
        2.点击“删除”按钮,删除一行附件
    -->
    <html>
    <head lang="en">
        <meta charset="UTF-8">
        <title></title>
        <script>
            function addFile(){
                var father = document.getElementById("content");
                var filer = document.createElement("input");
                filer.type="file";
                var myspan = document.getElementById("myspan");
                var buttoner = document.createElement("input");
                buttoner.type="button";
                buttoner.value="删除";
                buttoner.onclick=function(){
                    removeele(this);
                }
                father.insertBefore(filer,myspan);
                father.insertBefore(buttoner,myspan);
                var br = document.createElement("br");
                father.insertBefore(br,myspan);
    
            }
            function removeele(item){
                var father = document.getElementById("content");
                father.removeChild(item.previousSibling);
                father.removeChild(item.nextSibling);
                father.removeChild(item);
    
            }
        </script>
    </head>
    <body>
    
    <input type="button" value="添加附件" onclick="addFile()"/>
    
    <hr/>
    <div id="content">
        <input type="file" /><input type="button" value="删除" onclick="removeele(this)"/><br/>
        <input type="file" /><input type="button" value="删除" onclick="removeele(this)"/><br/>
        <span id="myspan">...</span>
    </div>
    </body>
    </html>
    

      

  • 相关阅读:
    配置Keepalived双主热备
    配置 Keepalived
    Keepalived安装部署
    Keepalived配置Nginx自动重启
    Collectiont和Collections的区别
    HashMap和Hashtable的联系和区别
    Vector和ArrayList的联系和区别
    ArrayList和LinkedList 的联系和区别
    集合和数组的比较
    struts下载
  • 原文地址:https://www.cnblogs.com/heviny/p/10827783.html
Copyright © 2020-2023  润新知