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" >出現顯示的內容</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>
//示例二
顯示一個層的同時隱藏另一個層
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
<script language="JavaScript" type="text/JavaScript">
<!--
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>
</script>
</head>
<body>
<div id="msg_1" style="display:block;float:left;" onclick='showhidediv("age")';>
<p id="photoTitle" >單擊此處添加描述</p></div>
<div id="msg_2" style="display:none;float:left;" >
<form id="">
<textarea class="textarea" id="" name=""></textarea>
<div class="">
<input type="button" value="保存" class="" id="">
<input type="button" value="取消" class="" id="" onclick='showhidediv("name")';>
</div>
<input type="hidden" name="" value=""></form>
</div>
</body>
</html>