一棵很好的树:可记忆的无限级树形菜单 xml+js

本文链接：https://blog.csdn.net/xidor/article/details/1722585

简介

dwnTree是一个可记忆的无限级树型菜单，它的特点如下：

菜单数据采用XML格式，依据XML文档树结构生成树型菜单，可在XML文档中设置子菜单在加载时是否展开和菜单链接的target方式
可启用记录菜单的打开状态（需要Cookie的支持）,记住用户最后的菜单操作状态
支持WEB标准，考虑语义化，支持IE5.5+，Firefox，Opera
使用简单，同一页面无限次使用

可以任意使用（因为涉及到cookie和ajax获取数据，本地请在虚拟环境下打开），请保留说明和链接，谢谢！

在线演示 http://dancewithnet.com/lab/2007/04/dwntree/
下载源码 http://dancewithnet.com/lab/2007/04/dwntree/dwntree.rar

http://dl2.csdn.net/down4/20070802/02152038715.rar

使用

下载源码，把图片、JS和CSS文件放入到相应的文件夹中
修改XML文件，建立需要的XML文档，比如dwnTree.xml

在HTML文档中加入如下代码，用以加载Javascript和CSS文件

<style type="text/css">
<!--
@import "dwnTree.css";
-->
</style>
<script type="text/javascript" src="dwnTree.js"></script>

在页面需要加入dwnTree的地方，建立容器标签，并随之调用dwnTree代码

<div id="dwnTree" class="dwnTree"></div>
<script type="text/javascript">//<![CDATA[
new dwnTree(’dwnTree.xml’,'dwnTree’);//调用dwnTree
//如果希望dwnTree记录菜单的状态，需要cookie的支持
//如果把这个cookie叫dwnTreeCookie,那么上面的代码变成：
new dwnTree(’dwnTree.xml’,'dwnTree’,{name:’dwnTreeCookie’});
//]]></script>

参数

dwnTree XML：
```
<item caption="关注" unfolded="">
    <item caption="互联网 &amp; IT" url="" target="_blank" />
    <item caption="电影 &amp; 电视" url="" target="_blank" />
</item>
```
参数值说明
caption 菜单名
unfold 空值或unfold 控制其子菜单加载时是否展开，为空时是不展开
url 菜单的链接合法的URL
target 菜单链接的打开方式

参数	值	说明
caption	菜单名
unfold	空值或unfold	控制其子菜单加载时是否展开，为空时是不展开
url	菜单的链接	合法的URL
target	菜单链接的打开方式

dwnTree Javascript：

new dwnTree('dwnTree.xml','dwnTree',
	{name:'dwnTreeCookie',hours:24,path:null,domain:null,secure:false});

参数	值	说明
dwnTree.xml	xml的路径	必须
dwnTree	菜单容器标签的ID	必须
name	cookie名	当有该值时，dwnTree开始记录菜单的状态
hours	cookie保留时间	默认是一年，即365*24
path	cookie路径
domain	cookie域
secure	cookie传输状态