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