div的visibility可以控制div的显示和隐藏，但是隐藏后页面显示空白
style="visibility: none;"
document.getElementById("typediv1").style.visibility="hidden";//隐藏
document.getElementById("typediv1").style.visibility="visible";//显示
通过设置display属性可以使div隐藏后释放占用的页面空间，如下
style="display: none;"
document.getElementById("typediv1").style.display="none";//隐藏
document.getElementById("typediv1").style.display="";//显示
此JS代码中，没有用try——Catch捕获错误，代码如下：
<script language="javascript">
//创建一个showhidediv的方法，直接跟ID属性
function showhidediv(id){
var sbtitle=document.getElementById(id);
if(sbtitle){
if(sbtitle.style.display==\'block\'){
sbtitle.style.display=\'none\';
}else{
sbtitle.style.display=\'block\';
}
}
}
</script>
<div id="show" onMouseMove=\'showhidediv("msg")\';>鼠标移动这里</div><!--这里是点击div，ID要下面的ID-->
<div id="msg" style="display:none;">出现显示的内容</div> <!--这里是MsgDiv-->
onMouseMove=\'showhidediv("msg")\'; 这里是鼠标动作，可以替换成Click或其他！
再次升级，做两个层之间的切换：
<script language="javascript">
//创建一个showhidediv的方法，直接跟ID属性
function showhidediv(id){
var age=document.getElementById("msg_2");
var name=document.getElementById("msg_1");
if (id == \'name\') {
if (name.style.display==\'none\') {
age.style.display=\'none\';
name.style.display=\'block\';
}
} else {
if (age.style.display==\'none\') {
name.style.display=\'none\';
age.style.display=\'block\';
}
}
}
</script>
<div id="show" style="float:left;" onMouseMove=\'showhidediv("name")\';>Name：</div><div id="show" style="float:left;" onMouseMove=\'showhidediv("age")\';>Age：</div>
<div id="msg_1" style="display:none;float:left;">林雨林</div>
<div id="msg_2" style="display:none;float:left;">18</div>