zoukankan      html  css  js  c++  java
  • JS操作DOM

    【功能:点击按钮显示表单】

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <script>
        function displays()
        {
            //定义节点
            var myRoot = document.getElementById("show");
            var form = document.createElement("form");
            var table = document.createElement("table");
            var tr = new Array(3);
            var td = new Array(6);
            var input = new Array(6);
            for(var i = 0; i < tr.length; i++)
            {
                tr[i] = document.createElement("tr"); 
            }
            for(var i = 0; i < td.length; i++)
            {
                td[i] = document.createElement("td"); 
            }
            for(var i = 0; i < input.length; i++)
            {
                input[i] = document.createElement("input"); 
            }
            //连接节点
            myRoot.appendChild(form);
            form.appendChild(table);
            for(var i = 0; i < tr.length; i++)
            {
                table.appendChild(tr[i]);
            }
            for(var i = 0, j = -0.5; i < td.length; i++, j += 0.5)
            {
                tr[Math.round(j)].appendChild(td[i]);
                td[i].appendChild(input[i]);
            }
            //设置属性
            input[0].type="text";
            input[0].value="用户名:";
            input[0].style.border="none";
            input[0].readOnly="true";
            input[1].type="text";
            input[2].type="text";
            input[2].value="密码:";
            input[2].style.border="none";
            input[2].readOnly="true";
            input[3].type="password";
            input[4].type="reset";
            input[5].type="submit";
        }
    </script>
    </head>
    
    <body>
        <input type="button" value="显示表单" onclick="displays();">
        <br/><br/><br/><br/>
        <div id="show">
        </div>
    </body>
    </html>

     

  • 相关阅读:
    Zabbix常见问题手册
    Shell脚本常用语句
    ZABBIX定义宏变量
    Zabbix4.0系统配置事件通知
    c++ 八皇后问题(转载)
    (c++)数据结构顺序表编码练习
    JPA的事务注解@Transactional使用总结(转)
    小程序开发流程(java后端)
    连接远程数据库,得到数据插入本地表中
    php复制目录
  • 原文地址:https://www.cnblogs.com/guanghe/p/5950537.html
Copyright © 2011-2022 走看看