/*
自动将一个普通的html列表改为折叠的树状目录
Version 1.2
last modified 2001/2/25
by starfish
starifh.h@china.com
注意：此代码只适用于ie！在ie 5.0下测试通过，虽然没有在ie 4.0下测试，但是在ie 4.0也应该可以使用
使用说明：
1。建立一个id为"tree"的div，在其内部按照目录树的层次结构建立一个普通的html列表（注意不能是数字列表，即必须用UL和LI标记），
2。按照标准HTML语法，每个LI标记内最多只能有一个UL标记；
3。每个LI标记内可以添加别的html元素；
4。在网页的...之间加上 ，
其中tree.js为本文件的名称，必要时加上相对路径；
5。如果需要指定目录和树叶的图片，在第四步加上的
之后（注意一定要加在tree.js后面，次序不能颠倒）加上
其中dc.gif是叶节点的图片，bs.gif是目录关闭时的图片，bo.gif是目录打开时的图片
indent=20指定下一级的目录项相对上一级的缩进量为20px；
如果不加这几句，默认没有图片，而默认缩进为20px;
6。如果某些列表项需要指定图片，可以在第2步时建立html列表时指定，例如如果列表中有一项为：
some item 则该列表项将会使用custom.gif作图片，
如果该列表项不是叶结点，而是目录节点，则可以为其指定目录打开时的图片open_img和目录关闭时的图片close_img
例如：
custom item 1
没有指定图片的节点将使用默认的图片， branch_close_img（目录关闭时的图片），
branch_open_img（目录打开时的图片）和leaf_img（叶节点图片）。
7。在网页的body标记内加上 onload="init()" ，例如：
8。当前选中的节点的类为selected,其他未选中的节点类为selected，可以通过lastSelected访问当前选中的节点；
可以利用CSS自定义选中的节点和未选中的节点的外观；
9。函数说明：
init();
初始化，必须加在body的onload事件中；
locate(s)
根据URL s定位，s必须是绝对地址;如果在某个节点中找到指向s的
链接(的形式)，则返回该节点，但是不做任何事，如果要选中该节点，必须调用LocateNode(locate(s));
LocateNode(r)
根据节点r(一个LI元素)在树中定位，并将包含r的目录打开，r如果是一个目录则将r的目录打开
openAll()
将所有的目录打开
closeAll()
将所有的目录关闭
lastSelected 指向当前选择的LI元素,可以通过它来访问树中下一个节点
select(e) 选择节点e，e 必须是一个LI元素,如果e 是目录则将它的目录打开；
GetLink(e) e是一个LI元素，返回e里面的第一个A元素
nextNode(e) 找到节点e在树中的下一个相邻节点，e 必须是LI元素
prevNode(e) 找到节点e在树中的上一个相邻节点，e 必须是LI元素
*/
var leaf_img=""; //叶节点图片
var branch_close_img=""; //分支关闭时的图片
var branch_open_img=""; //分支打开时的图片
var indent=20; //左边缩进,默认值20px
var lastSelected=null; //指向当前选择的LI元素,可以通过它来访问树中下一个节点
//============================ 以下是初始化部分 ==================================
function init() //初始化
{ if (document.all.tree==null) return;
var coll = document.all.tree.children.tags("UL");
var s="";
if (coll!=null)
for (var i=0;i";
}
document.all.tree.innerHTML=s; //画出目录树
}
function initUL(r) //初始化UL tag,返回修改后的r的innerHTML
{
var sn="";
var cli=r.children.tags("LI");
if (cli!=null)
for (var i=0;i0) //如果r有子表
{ p=si.indexOf(""); //找到子表的起始位置p
leaf=false; //r不是树叶
for (var i=0;i"+initUL(cul[i])+"
";
}
var oimg=(r.open_img!=null)? r.open_img:branch_open_img;
var cimg=(r.close_img!=null)? r.close_img:branch_close_img;
var limg=(r.leaf_img!=null)? r.leaf_img:leaf_img;
var imgstr="";
if (leaf) imgstr="![]("+limg+")
";
else imgstr="![]("+cimg+")
";
sn=""+
""+
imgstr+
" "+
si.substring(0,p)+
""+
""+
sn+
"";
return sn;
}
//============================ 以上是初始化部分 ==================================
//====================== 以下函数响应鼠标单击事件 =================================
function doclick(r) //响应鼠标单击事件,r是一个span元素
{
if (r.parentElement.className=="branch") //如果选择的是树枝（r的parentElement是一个LI元素）
{
//alert(r.status);
if (r.status=="closed") r.status="opened"; else r.status="closed"; //改变节点r的状态标记
// alert(r.status);
var cul=r.parentElement.children.tags("UL");
if (cul!=null)
for (var i=0;i0)
for (var i=0;i0)
for (var i=0;i0)
for (var i=0;i0)
for (var i=0;i0)
for (var j=0;j0) //如果r是目录
{
r.children[0].status="closed";
var mm=r.children[0].children[0];
mm.src=mm.close_img; //切换目录图片
for (var i=0;i0)
for (var j=0;j0) //如果r是目录
{
r.children[0].status="opened";
var mm=r.children[0].children[0];
mm.src=mm.open_img; //切换目录图片
for (var i=0;i0) //如果e有儿子
{
var t=cul[0].children.tags("LI");
if (t!=null&&t.length>0)
return(t[0]); //返回e 的第一个儿子;
}
var par,i,son;
while (true)
{
par=e.parentElement; //par是e的父亲元素，应该是一个UL元素
if (par==null||par.tagName!="UL") return(null);//如果e没有父亲，则失败返回
son=par.children.tags("LI");
if (son!=null&&son.length>0)
for (i=0;i0)
for (i=0;i0) return(son[i-1]);//e不是他的父亲的第一个儿子，返回e的父亲的上一个儿子
par=par.parentElement;
// while (par!=null&&par.tagName!="BODY"&&par.tagName!="LI") par=par.parentElement;
if (par!=null&&par.tagName=="LI") return(par);
else return(null);
}