【功能:点击按钮显示表单】
<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>