javascript+CSS树形菜单

<!--此树状菜单的原理只要就是利用CSS的display属性，
当display="none"时，就不显示子菜单，当display时，又重新显示子菜单，
只要你搞明白了下面这一段代码，相信你绝对能扩展它的功能，把它做得更复杂点，更美观点，谢谢
可以加上链接，展开时是一种图片，收合时又显示另一种图片，为了使本文更适合初学者，这些代码我就不写了，搞明白下面代码之后你就可以慢慢想如何扩展。。
先给点提示，使用document.getElementById("图片ID").src="新图片地址", 可以动态更换图片
-->
<!--
版权信息: javascript+CSS树形菜单,
本代码为免费发布,但使用时请勿去除作者版权信息
本声明没有任何法律效力,作为一个程序员,尊重他人版权,也等于尊重自己版权,谢谢合作
作者:王颂元
出处:www.web745.com

-->
<script language="javascript">
    function change_view(obj_name)
    ...{
        var aa=document.getElementById(obj_name);
        if(aa.style.display=="")
        ...{
            aa.style.display="none";
        }
        else
        ...{
            aa.style.display="";
        }
    }
</script>

<table width="160" border="1">
      <tr onClick="change_view('a1')">
        <td>●树形菜单根目录1</td>
      </tr>
     <tr id="a1"style="display:none">   <!-- 如果想一打开网页菜单就是展开的，此处删除none--->
        <td>
            <table width="143" border="0">
                  <tr>
                    <td width="28">&nbsp;</td>
                    <td width="105">二级菜单1</td>
                  </tr>
                  <tr>
                    <td>&nbsp;</td>
                    <td>二级菜单2</td>
                  </tr>
                  <tr>
                    <td>&nbsp;</td>
                    <td>二级菜单3</td>
                  </tr>
            </table>
        </td>
  </tr>
  
  
    <tr onClick="change_view('a2')">
        <td>●树形菜单根目录2</td>
      </tr>
      <tr id="a2"style="display:none">
        <td>
            <table width="143" border="0">
                  <tr>
                    <td width="28">&nbsp;</td>
                    <td width="105">二级菜单1</td>
                  </tr>
                  <tr>
                    <td>&nbsp;</td>
                    <td>二级菜单2</td>
                  </tr>
                   <tr>
                    <td>&nbsp;</td>
                    <td>二级菜单3</td>
                   </tr>
            </table>
        </td>
  </tr>
  
  
    <tr onClick="change_view('a3')">
        <td>●树形菜单根目录3</td>
      </tr>
      <tr id="a3"style="display:none">
            <td>
            <table width="143" border="0">
                  <tr>
                    <td width="28">&nbsp;</td>
                    <td width="105">二级菜单1</td>
                  </tr>
                  <tr>
                    <td>&nbsp;</td>
                    <td>二级菜单2</td>
                  </tr>
                  <tr>
                    <td>&nbsp;</td>
                    <td>二级菜单3</td>
                  </tr>
            </table>
        </td>
  </tr>
 </table>

<!--代码结束-->