JavaScript实现树形目录式菜单

/**/ /**
 *    功能：树形目录式菜单
 *  默认隐藏子菜单，点击主菜单前图标（如：+）展开其子菜单（图标变化为—），再次点击可收起
 *    调用示例：
 *  增加引用：<script type="text/javascript" src="TreeMenu.js"></script>
 *      页面代码：
 *  <div id="menu1" οnclick="TreeMenu(this,'child1')">
 *   <img src="plus.gif" ><a href="#">菜单1</a>
 *  </div> 
 *   <div id="child1" style="display:none">
 *       <a href="#">页面1</a><br>
 *       <a href="#">页面2</a>
 *   </div>
 *  <div id="menu2" οnclick="TreeMenu(this,'child2')">
 *   <img src="plus.gif"><a href="#">菜单2</a>
 *  </div>
 *   <div id="child2" style="display:none">
 *        <a href="#">页面1</a><br>
 *        <a href="#">页面2</a>
 *   </div>
 *
 */

function  TreeMenu(node,id)
... {
 var sibling = document.getElementById(id);

 if (sibling.style.display == 'none')
 ...{
  if (node.childNodes.length > 0)
  ...{
   if (node.childNodes[0].tagName == "IMG")
   ...{
    node.childNodes[0].src = "minus.gif"; //替换为展开时的图片
   }
  }

  sibling.style.display = '';
 }
 else
 ...{
  if (node.childNodes.length > 0)
  ...{
   if (node.childNodes[0].tagName == "IMG")
   ...{
    node.childNodes[0].src = "plus.gif";  //替换为收起时的图片
   }
  }
  sibling.style.display = 'none';
 }
}