js后台常用的伸缩(折叠)菜单代码

 <style type="text/css">

*{margin:0;padding:0;}
body{padding-top:10px;}
div{width:150px;height:22px;margin-left:10px;overflow:hidden;font-size:12px;background:#FFF;}
div div{clear:both;height:22px;margin:0;padding-left:25px;font-size:13px;line-height:22px;background:#CCC;cursor:pointer;}
div ul li{list-style:none;}
a:link,a:visited{width:121px;height:20px;padding-left:29px;line-height:20px;color:#000;text-decoration:none;display:block;}
a:hover{background:#eee;}
</style>
HTML部分
<div style="height:auto">
 <div>菜单一</div>
 <ul>
  <li><a href="#">功能一</a></li>
  <li><a href="#">功能二</a></li>
 </ul>
</div>
<div>菜单二</div>
<ul>
<li><a href="#">功能一</a></li>
<li><a href="#">功能二</a></li>
</ul>
</div>
<div>菜单三</div>
<ul>
<li><a href="#">功能一</a></li>
<li><a href="#">功能二</a></li>
</ul>
</div><div style="height:auto;color:#666;line-height:20px;cursor:default;">
 <div style="color:#000;">版本信息</div>
  名称:<br />
  版本:<br />
  核心:<br />
</div>
 
 
<script type="text/javascript">
window.onload=function(){
var div=document.getElementsByTagName("div");
 for(i=0;i<div.length-2;i++){
  if(i%2!=0){
    if(div[i-1].getElementsByTagName("ul").length>0){
   div[i].divid=i;
   div[i].onclick=function(){
    var div=document.getElementsByTagName("div");
    for(j=0;j<div.length-2;j++){
      if(j%2==0&&j+1!=this.divid){
        div[j].style.height="22px";
       }
     }
    var div=this.offsetHeight;
    var Div=this.parentNode;
    var DivClass=Div.offsetHeight;
    if(DivClass<=div){Div.style.height="auto";}else{Div.style.height="22px";}
     }
   }
    }
  }
 }
</script></td>
 </tr>
</table>