注意：有些图片不能直接黏贴上来，详细见附件
一、
最近任务实现一个树状菜单，最开始，我打算使用：
Pro-Man（写在jsp页面）
Book(01)
---Book Search(011)
---Book Add(012)
Flower(02)
---- Flower Search(021)
??? ???????? ?---- Flower Add(022)
将每条存成一个记录，给表增加一个rankcode字段（括号里的值），这样，把数据库里的值一次性取出来，按照rankcode排序，可以得到如上的顺序的list对象。
事实证明：可以取出来，并显示，而且，我也实现了点击一级，所有收起，点击二级，对应的三级收起。我使用的是js，完全自己写js实现的折叠。
结果：效果实现了，但是，特别不美观，好像一级二级三级都独立，页面看不到那种树桩感觉。因为
////////图见附件
那个连接的线条没有，图片很难加上，而且图片和文字布局、文字和文字间的布局也很难把握，所以，想使用这个方法的念头打消了。
二、
后来发现了一个组件特别好用，研究了好一阵才整出来：dtree.js这个是Jquery提供的一个工具。下面就详细介绍一下如何实现一个树状菜单，以及遇到的问题：
1>准备工作：
1.?????? 需要的js：dtree.js、jquery.js
2.?????? dtree.css、img（里面有上图中的线条和基本的电脑图形、光盘图形等。我们可以往里面添加新的图形，也可以替换掉某些图形。注意dtree.css引用了img里的图形，如线条，如树状菜单的根目录默认是img/base.gif）
3.?????? 需要的jar包：json-lib-2.1.jar而json又依赖下面这几个包：commons-lang-2.4.jar、commons-logging-1.1.1.jar、json-lib-2.2.3-jdk13.jar、ezmorph-1.0.6.jar、commons-collections-3.2.1.jar
2>简介：后台Action使用json，将Menu对象封装进List，使用jquery.js提供的方法，将list转为json字符串：
////////图见附件
此外Action中还有一个方法：
////////图见附件
这个看到前台页面就知道为什么我们用俩个方法了。
3>前台显示：
1.main.html
////////图见附件
Src对应的是上面的menu()方法，返回的是left.jsp
2.left.jsp
////////图见附件
红线是框起来的是关键点:使用jquery.js和dtree.js来操作后台传来的json字符串（其实是数组形式）：
[{"id":1,"parentId":-1,"role":10,"label":"Proto_Management","url":"welcome.action"},{"id":2,"parentId":1,"role":3,"label":"sim","url":""},{"id":3,"parentId":1,"role":3,"label":"proto","url":""}]
4>看一下数据库：
////////图见附件
三、遇到的问题
1.后台的json字符串可以取到，前台也可以alert出来，可就是tree.add（）一句进不去值
解决：
1.? 数据库：
1>根节点的id可以是0、1等任何都可以，但是其pid要为-1,（不可以为0）
2>要录完一级、录二级、三级、这样按照顺序来，否则会影响树状菜单的构成
3>url可以为空，但是pid不能为空
2.? 添加上 async:false
3.? query.js和dtree.js是可以混合用的如上图：紫框框是query.js里封装ajax的使用，框里的红线是dtree.js里的函数添加节点。
4.? 一定要引入dtree.css和img。因为这个关系到树状菜单的显示效果。我们可以调整css，可以替换图片。
四、补充：dtree.add()方法里用到的几个参数及含义：
////////图见附件
具体参看：