如何做一个树形目录？和本论坛左边的一样。

<table width="778" border="0" cellspacing="0" cellpadding="0" align="center">
  <tr> 
    <td width="180" height="556" valign="top" bgcolor="#666666"> 
      <script>
//菜单一 first item----------------------------------------------------------
var item_num=10;
//var power=<%=session("power")%>;
  //父层菜单的行数 Hom many rows is the parent item
var item02_word=new Array();  //菜单的文字 The words of the child item
for(i=0;i<item_num;i++)
  item02_word[i]=new Array();  item02_word[0][0]="管理员资料修改";
  item02_word[0][1]="代理商添加";
  item02_word[0][2]="代理商管理";  item02_word[1][0]="会员添加";
  item02_word[1][1]="会员管理";  item02_word[2][0]="待审会员";
  item02_word[2][1]="加锁会员";  item02_word[3][0]="新闻添加";
  item02_word[3][1]="新闻管理";  item02_word[4][0]="添加活动";
  item02_word[4][1]="活动信息查看和管理";
  item02_word[4][2]="活动查看和管理";  item02_word[5][0]="待审活动";
  item02_word[5][1]="加锁活动";  item02_word[6][0]="信息查看和管理";
  //item02_word[5][1]="    ";
  //item02_word[5][2]="    ";  item02_word[7][0]="添加新闻栏目";
  item02_word[7][1]="管理新闻栏目";
  item02_word[7][2]="添加新闻";
  item02_word[7][3]="管理新闻";
 
  
  item02_word[8][0]="    ";
  
  item02_word[9][0]="    ";var item02_link=new Array();  //菜单的链接 The links of the child item 
for(i=0;i<item_num;i++)
  item02_link[i]=new Array();
  item02_link[0][0]="edit_qx.asp";         
//  item02_link[0][1]="add_qx.asp";
  item02_link[0][1]="league_add.asp";
  item02_link[0][2]="league.asp";  item02_link[1][0]="add_hy.asp";
  item02_link[1][1]="edit_hy.asp";  item02_link[2][0]="hy_chcek.asp";
  item02_link[2][1]="hy_kye.asp";  item02_link[3][0]="index_new_add.asp";
  item02_link[3][1]="index_new_ch_edit.asp";
  item02_link[4][0]="party_add.asp?self_id=1";
  item02_link[4][1]="class1.asp";
  item02_link[4][2]="party.asp";  item02_link[5][0]="p_check1.asp";
  item02_link[5][1]="p_lock.asp";
  
  item02_link[6][0]="class2.asp";
  //item02_link[5][1]="#";
  //item02_link[5][2]="#";    item02_link[7][0]="news_c_add.asp";
  item02_link[7][1]="news_c.asp";
  item02_link[7][2]="news_add.asp";
  item02_link[7][3]="news.asp";
  
  item02_link[8][0]="#";
  
  item02_link[9][0]="#";
  
var item02=new Array();  //菜单的HTML The HTML code of the child item
for(i=0;i<item_num;i++)
  item02[i]="";
  
for(i=0;i<item_num;i++)
  for(j=0;j<item02_word[i].length;j++)
    item02[i]+=" &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="+item02_link[i][j]+" target=if onclick=javascript:this.blur();><font color=#ffffff>"+item02_word[i][j]+"</font></a><br>";</script><script language=javascript>
//打开与关闭菜单函数
function closeTopTree()
{
  for(i=0;i<topTreeTable.cells.length/2;i++)
  {
    topTreeTable.cells[2*i+1].innerHTML="";
  }
}function openTopTree(n)
{
  if(topTreeTable.cells[2*n+1].innerHTML=="")
  {
    closeTopTree();
switch(n)
{
case 0 : {topTreeTable.cells[2*n+1].innerHTML=item02[0];break;}
case 1 : {topTreeTable.cells[2*n+1].innerHTML=item02[1];break;}
case 2 : {topTreeTable.cells[2*n+1].innerHTML=item02[2];break;}
case 3 : {topTreeTable.cells[2*n+1].innerHTML=item02[3];break;}
case 4 : {topTreeTable.cells[2*n+1].innerHTML=item02[4];break;}
case 5 : {topTreeTable.cells[2*n+1].innerHTML=item02[5];break;}
case 6 : {topTreeTable.cells[2*n+1].innerHTML=item02[6];break;}
case 7 : {topTreeTable.cells[2*n+1].innerHTML=item02[7];break;}
case 8 : {topTreeTable.cells[2*n+1].innerHTML=item02[8];break;}
case 9 : {topTreeTable.cells[2*n+1].innerHTML=item02[9];break;}
}
  }
  else
    closeTopTree();
}
</script>
<table width="100%" border="0" cellspacing="0" cellpadding="3" id=topTreeTable>
        <tr> 
          <td height="26" align="center"  bgcolor="#CCCCCC"><a href=#none onclick="openTopTree(0);"> 
            管理员</a></td>
        </tr>
        <tr> 
          <td></td>
        </tr>
        <tr> 
          <td height="26" align="center"  bgcolor="#CCCCCC"><a href=#none onclick="openTopTree(1);">相约出游会员管理</a></td>
        </tr>
        <tr> 
          <td></td>
        </tr>
        <tr> 
          <td height="26" align="center"  bgcolor="#CCCCCC"><a href=#none onclick="openTopTree(2);">相约出游会员审核与加锁</a></td>
        </tr>
        <tr> 
          <td></td>
        </tr>
        <tr> 
          <td height="26" align="center"  bgcolor="#CCCCCC"><a href=#none onClick="openTopTree(3)">旅游常识</a></td>
        </tr>
        <tr> 
          <td></td>
        </tr>
        <tr> 
          <td height="26" align="center"  bgcolor="#CCCCCC"><a href=#none onclick="openTopTree(4);">活动信息管理</a></td>
        </tr>
        <tr> 
          <td></td>
        </tr>
        <tr> 
          <td height="26" align="center"  bgcolor="#CCCCCC"><a href=#none onClick="openTopTree(5);">活动审核与加锁</a></td>
        </tr>
        <tr> 
          <td></td>
        </tr>
        <tr> 
          <td height="26" align="center"  bgcolor="#CCCCCC"><a href=#none onClick="openTopTree(6);">会员发布信息活动管理</a></td>
        </tr>
        <tr> 
          <td></td>
        </tr>
        <tr> 
          <td height="26" align="center"  bgcolor="#CCCCCC"><a href=#none onclick="openTopTree(7);">新闻系统</a></td>
        </tr>
        <tr> 
          <td></td>
        </tr>
        <tr> 
          <td height="26" align="center"  bgcolor="#CCCCCC"><a href=#none onclick="openTopTree(8);"></a></td>
        </tr>
        <tr> 
          <td></td>
        </tr>
        <tr> 
          <td height="26" align="center"  bgcolor="#CCCCCC"><a href=#none onclick="openTopTree(9);"> 
            </a></td>
        </tr>
        <tr> 
          <td></td>
        </tr>
      </table>
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td height="26" align="center" bgcolor="#CCCCCC"><a href="logout.asp"> 退出管理</a></td>
        </tr>
      </table>
    </td>
    <td width="630" valign="top" id="if1"> 
      <iframe src="wel.asp" name="if" width="100%" height="100%" frameborder="0"></iframe>
</td>
  </tr>
</table>