javascript实现树状菜单最简单的方法
可以将代码增强,比如加小图标,展开和收缩颜色等等!
代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>树状菜单的简单实现</title> <script language="JavaScript" type="text/javascript"> <!-- function toggle(_dt){ var _dl=_dt.parentNode; if(_dl.className=="collapse")_dl.className="expand"; else _dl.className="collapse"; } //--> </script> <style type="text/css"> <!-- dl dt { cursor:pointer;padding:3px;} dl dd { padding:3px;} .expand { height:auto;} .collapse { height:20px;overflow:hidden;} --> </style> </head> <body> <dl> <dt onclick="toggle(this)">根结点(点我)</dt> <dd>子结点1</dd> <dd>子结点2</dd> <dd>子结点3</dd> <dd>子结点4</dd> </dl> </body> </html>