一次只显示一个菜单。

网上菜单一堆，但打开人家的代码相当的长，是在看不下去，现在做一个简单的一次只显示一个的菜单给打架看看，不是很美观，我不会美工的，代码很简单就一个fold函数。代码如下：

< html >
< head >
< TITLE >  一次只显示一个菜单  </ TITLE >
< META NAME = " Generator "  CONTENT = " EditPlus " >
< META NAME = " Author "  CONTENT = "" >
< META NAME = " Keywords "  CONTENT = " 教务在线系统 " >
< META NAME = " Description "  CONTENT = " 教务在线系统 " >
< SCRIPT LANGUAGE = " JavaScript " >
<!--
     function  fold() ... {
    var len = document.getElementsByTagName("span").length;
    var obj = event.srcElement;//获取当前点击的对象（这里就是span元素）
    for(i = 0;i<len;i++)...{
        var element = document.getElementsByTagName("span")[i];
        var parent = element.parentNode.children(1) ;
        if(element == obj)...{        //判断当前点击的span元素是否和当前遍历的span元素是同一个对象
            parent.style.display = parent.style.display == "block"?'none':"block";
        }
        else...{
            parent.style.display = 'none';
        }
    }
}
// -->
</ SCRIPT >
< style >
     /**/ /*应用院系等折叠式菜单*/
    .deplist ... {
        border:1 solid #000;
        font-size:10pt;font-weight:bold;
        margin:0;
        background-color:#F8FBFF; color:#330066;
        width:100px;;height:20px;
        text-align:center;
    }
    .deplist li ... {
        list-style-type:none;
        list-style-position:outside;
        background-color:#FFF;padding-top:5px;
        display:none;
    }
    .deplist span ... {
        float:right;
        cursor:hand;
        color:#330066;
        text-align:center;
        width:100%;
      }

    table ... {
        width:100%;
    }
    td ... {
        text-align:center;
        font-size:10pt;
        color:#828282;
    }
</ style >
< body >
     < ul class = deplist >< span onclick = " fold() " > 菜单一 </ span >
         < li >
             < table border  =   1  cellspacing = 0 >
                 < tr >
                     < td > 内容一 </ td >
                 </ tr >
                 < tr >
                     < td > 内容二 </ td >
                 </ tr >
                 < tr >
                     < td > 内容三 </ td >
                 </ tr >
                 < tr >
                     < td > 内容四 </ td >
                 </ tr >
             </ table >
         </ li >
     </ ul >
     < ul class = deplist >< span onclick = " fold() " > 菜单二 </ span >
         < li >
             < table border  = 1  cellspacing = 0 >
                 < tr >
                     < td > 内容一 </ td >
                 </ tr >
                 < tr >
                     < td > 内容二 </ td >
                 </ tr >
                 < tr >
                     < td > 内容三 </ td >
                 </ tr >
                 < tr >
                     < td > 内容四 </ td >
                 </ tr >
             </ table >
         </ li >
     </ ul >
     < ul class = deplist >< span onclick = " fold() " > 菜单三 </ span >
         < li >
             < table border  = 1  cellspacing = 0 >
                 < tr >
                     < td > 内容一 </ td >
                 </ tr >
                 < tr >
                     < td > 内容二 </ td >
                 </ tr >
                 < tr >
                     < td > 内容三 </ td >
                 </ tr >
                 < tr >
                     < td > 内容四 </ td >
                 </ tr >
             </ table >
         </ li >
     </ ul >
</ body >
</ html >