用js写的一个树的类。。

****************************************************************************
树模型

athor：baibai
support:cici
date：2009.5.10
description:
类似于.net树形结构模型，1/通过makeTree()创建一个TreeView对象(vartree=makeTree();)
2/创建需要的节点(vartn1=newTreeNode("节点1");vartn2=newTreeNode("节点2");)
3/创建节点之间的包含关系(tn1.add(tn2);)
4/把节点添加到最开始生成的tree对象上,调用tree对象的show方法,返回生成的树html代码;(varmaxtrees=tree.show();)
5/最后可直接插入层中显示(document.getElementById('divs').innerHTML=maxtrees;)
****************************************************************************




//整体输出的tree代码
vartrees="";
//树中div的id值，程序中累加
varthisID=1;
//树的图标
vartreeICON="images/base.gif";
//树的点击后图标
vartreeAfterICON="images/page.gif";
//填补空白的图标
vartreeEmpty="images/empty.gif";
//图片属性
varimgProperty="border='0'align='absmiddle'";
//树是展开还是关闭1展开，0关闭
vartreeProperty=1;




//树模型
functionTreeView()
{
this.show=function()
{
returntrees;
}
this.addNode=function(node)
{
trees+=node.outtext;
}
}


//节点模型
//根据打开关闭，做相关操作
varopens;
varcloses;
varstyles;
if(treeProperty==1){opens=treeAfterICON;closes=treeICON;styles="style='display:block;'"}
else{opens=treeICON;closes=treeAfterICON;styles="style='display:none;'"}


functionTreeNode(text,url)
{
this.myid=thisID;
thisID++;
this.text=text;
this.url=url;
this.outtext="aimgsrc='"+opens+"'"+imgProperty+"onclick=nodeClick(this,'"+this.myid+"')/aahref='"+this.url+"'"+text+"/abrdiv"+styles+"id='"+this.myid+"'/div";

this.add=function(node)
{
varimgURL="imgsrc='"+opens+"'";
re=newRegExp(imgURL,"gi");//建立正则表达式-全部替换
node.outtext=node.outtext.replace(re,"imgsrc='"+treeEmpty+"'"+imgProperty+"onclick=nodeClick(this,'"+this.myid+"')imgsrc='"+opens+"'");
this.outtext=this.outtext.replace(/\/div+$/,node.outtext+"/div");
}
}


//返回一个树模型
functionmakeTree()
{
returnnewTreeView();
}


//tree的点击展开，收起事件
functionnodeClick(img,thisID){
if(document.getElementById(thisID).style.display=='none')
{
document.getElementById(thisID).style.display='block';//如果触动的层如果处于隐藏状态，即显示
img.src=treeAfterICON;
}
else
{
document.getElementById(thisID).style.display='none';//如果触动的层如果处于显示状态，即隐藏
img.src=treeICON;
}


}
已投稿到：阅读||||前一篇：
评论[发评论]发评论

验证码：
发评论