dtree基础

dtree目录下包括这些文件：example01.html 、 dtree.js 、 api.html 、 dtree.css 和img目录  注意：除了api.html之外，其它的文件都是必须拷贝的。api.html是dtree的函数介绍。

1. dtree.js : dtree功能脚本

2. dtree.css : 样式文件

3. img文件夹 : 存放dtree使用的图标 

 其中 打开example01.html文件  

     <link rel="StyleSheet" href="css/dtree.css" type="text/css" />   

     <script type="text/javascript" src="js/dtree.js"></script>  

这里的这两行代码，懂IT的都应该知道放到哪里，example01.html里面也有这个代码，放到head中就可以了，注意指定路径。

生成树 节点的代码：

      <script type="text/javascript">   

         <!--   

         d = new dTree(’d’);//创建一个树对象   

         d.add(0,-1,’My example tree’); //创建一个树对象   

         d.add(1,0,’Node 1’,’example01.html’);   

         d.add(2,0,’Node 2’,’example01.html’);   

         d.add(3,1,’Node 1.1’,’example01.html’);   

         d.add(4,0,’Node 3’,’example01.html’);   

         d.add(5,3,’Node 1.1.1’,’example01.html’);   

         d.add(6,5,’Node 1.1.1.1’,’example01.html’);   

         d.add(7,0,’Node 4’,’example01.html’);   

         d.add(8,1,’Node 1.2’,’example01.html’);   

         d.add(9,0,’My Pictures’,’example01.html’,’Pictures I’ve taken over the years’,’’,’’,’img/imgfolder.gif’);   

         d.add(10,9,’The trip to Iceland’,’example01.html’,’Pictures of Gullfoss and Geysir’);   

         d.add(11,9,’Mom’s birthday’,’example01.html’);   

         d.add(12,0,’Recycle Bin’,’example01.html’,’’,’’,’img/trash.gif’);   

         document.write(d);   

         //-->   

     </script>   

d.add(0,-1,’My example tree’);  

      这一句为树添加了一个根节点，显示名称为’My example tree’     d.add(1,0,’Node 1’,’example01.html’);  

     这一句在树的根节点下面添加了一个子节点。（d.add（）方法的参数具体含义可参见api.html文件）

更详细的内容，感觉自我总结不如看看附件中，网友的PPT，我是按照PPT学会的，建立静态表简单，但是建立动态树的时候，就需要用一些循环，来依次读取数据库或者文件内容，循环中add ，然后再提交画出树，这样比较简单。在这个建树过程中需要注意dtree.js里面的那些代码，尤其是this.icon 部分是指定的图片位置，这个地方可能需要按需修改，其他地方基本不需要。

如果对dtree不懂，可以直接找我联系。

jinhuer168@163.com 

jinhuer168@gmail.com 这是我的gmail邮箱+gtalk

我经常用Gtalk+163邮箱