Java项目中树形菜单的创建课件.pptVIP

树型菜单的创建1.

目录使用dTree构建树型菜单使用XTree构建树型菜单使用XLoadTree构建AJAX树型菜单使用JQuery树型插件构建树型菜单2.

引言树型菜单是经常用到的数据组合和显示方式。3.

dTree构建树型菜单dTree是一种免费的javascript树型菜单/javascripts/tree/4.

dTree的使用（一）引入树在head标签中加入dtree.js和dtree.css如下:link?rel=StyleSheet?href=dtree.css?type=text/css?/??script?type=text/javascript?src=dtree.js/script??注意要把dTree包下的js,css和img放到相应目录root节点的pid必须为-15.

dTree的使用（二）实例化树并显示div?class=dtree????????script?type=text/javascript??????????!--????????????d?=?new?dTree(d);????????????d.add(0,-1,My?example?tree);??????????d.add(1,0,Node?1,example01.html);????????????????document.write(d);????????????//--??????/script????/div??实例化树显示树在树中添加节点6.

add方法的参数说明dTtotype.add?=?function(id,?pid,?name,?url,?title,?target,?icon,?iconOpen,?open)?7.

XTree构建树型菜单XTree是基于对象操作的树型菜单/dhtml/xtree/implementation.html8.

XTree的使用（一）引入树在head标签中加入xtree.js和xtree.css如下:script?src=xtree.js/script??link?type=text/css?rel=stylesheet?href=xtree.css??9.

XTree的使用（二）实例化树并显示div?style=position:?absolute;?width:?200px;?top:?0px;?left:?0px;?height:?100%;?padding:?5px;?overflow:?auto;??script??if?(document.getElementById)?{??????var?tree?=?new?WebFXTree(Root);??????tree.setBehavior(classic);??????var?a?=?new?WebFXTreeItem(1);??????tree.add(a);??????var?b?=?new?WebFXTreeItem(1.1);??????a.add(b);???????????document.write(tree);??}?/script???/div??实例化树显示树实例化节点在树中添加节点在树中某个节点下添加子节点10.

XLoadTree构建Ajax树型菜单xloadtree是一款非常优秀的ajax树控件它是基于js和xml的；/dhtml/xloadtree/implementation.html11.

XLoadTree的使用（一）引入树在head标签中加入xtree.js,xtree.css,xmlextras.js,xloadtree.js如下:!--引入xtreescriptfile--scriptsrc=xtree.js/script!--引入XML解析scriptfile--scripttype=text/javascriptsrc=xmlextras.js/script!--引入xloadtreescriptfile--scripttype=text/javascriptsrc=xloadtree.js/script!--引入xtreecss--linktype=text/cssrel=stylesheethref=xtree.css12.

XLoadTree的使用（二）实例化树并显示div?style=position:?absolute;?width:?200px;?top:?0px;?left:?0px;?height:?100%;?padding:?5px;?over