1、先实现一个按钮和一个div层:<body> <div id="div1"> <tab造婷用痃le> <tr><td>账号</td><td><input type="text"></td></tr> <tr><td>密码</td><td><input type="text"></td></tr> </table> <a href="javascript:CloseDiv();">关闭</a> </div> <input type="button" value="打开" onclick="javascript:OpenDiv();" id="open"></body>
2、为按钮和div层添加样式首先将div层隐藏:<style> #div1{ display: none; position: absolute; left:50%; top:50%; width:250px; height:150px; background-color:gray; text-align: center; } #open{ position: absolute; top:50%; left:50%; width:100px; height:50px; }</style>
3、给按钮添加onclick事件:<script>function OpenDiv(){ document.getElementById("div1").style.display="block"; document.getElementById("open").style.display="none"; }给div层中的关闭添加onclick事件:function CloseDiv(){ document.getElementById("div1").style.display="none"; document.getElementById("open").style.display="block"; } </script>