本文共 446 字，大约阅读时间需要 1 分钟。

实现了一种三级导航菜单的展开收缩效果，通过传递子目录的id值至JavaScript函数进行控制。在代码中，主要采用了div和ul/li的嵌套结构搭建菜单树，每个主菜单设置了唯一的id值并附加onclick事件调用。

技术实现主要包括以下几个方面：首先，主导菜单定义其id值为"sa1"，其子菜单id值设置为"sa1b1"或"sa1b2"等；其次， اح 顾对方定义对应的sub-menu id值；再次，在each主菜单节点上添加onclick事件，将传递的id值作为参数。在JavaScript部分，通过获取元素byId获取相应的sub-menu对象，判断其display属性是否为"block"或""(表示已打开)，如果是则设置为"none"，否则设置为"block"，完成展开或收缩动作。

整个实现过程简单易懂，无需复杂初始设置，只需确保每个主菜单节点的id不互相重复即可。这种方式不仅减少了JavaScript代码的复杂性，同时也保证了菜单树结构的清晰可控，对于多层级目录系统尤为适用。

转载地址：http://bccmz.baihongyu.com/