<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>js控</title>
<script language="网页特效" type="text/javascript">
<!--
function toggle(targetid){
if (document.getelementbyid){
target=document.getelementbyid(targetid);
if (target.style.display=="block"){
target.style.display="none";
} else {
target.style.display="block";
}
}
}
-->
</script>
<style type="text/css教程">
<!--
#div1{
background-color:#000000;
height:400px;
width:400px;
display:none;
}
-->
</style>
</head><body>
<input type="button" id="butn" value="显示/隐藏" onclick="toggle('div1')" />
<center>
<div id="div1"></div></center>
居中的div
</body>
</html>方法二
<html>
<head>
<title>显示与隐藏</title>
<script>
function dis(b){
document.getelementbyid('qq').style.display = (document.getelementbyid('qq').style.display=="block") ? "none" : "block";
b.value = (b.value=="显示") ? "隐藏" : "显示";
}
</script>
<style type="text/css">
#qq {display:none}
</style>
</head>
<body>
<input type="button" name="submit" value="显示" onclick="dis(this)">
<div id="qq">
<table width="300" height="200" border="0" cellpadding="1" cellspacing="1">
<tr>
<td width="100%" bgcolor="#3366ff">内容,这个表格是嵌套在id是"qq"的div中的</td>
</tr>
</table>
</div>
</body>
</html>