首页 > 代码库 > JS操作DOM
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>
JS操作DOM
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。