一个很实用和好用的资源管理器的树形目录源码

本原码从网上下载，经本人改写，功能更强大，使用更方便，可以有无限级目录，一次性载入，可以分别设置树结点和叶结点的颜色及图标，可以展开和收缩，可以显示当前所处的路径位置，点击树结点时只在展开时显示树结点的超链接，不过，据测试，一次性载入500个节点时浏览器会显示“该脚本会使浏览器变慢”的提示，不过，选择不取消执行不会影响浏览器的性能。
function Folder(folderDescription, hreference,parentid,target) {
//constant data;

this.desc = folderDescription;
this.parentid=parentid;
this.hreference = hreference;
this.target=target;
this.id = index;
this.navObj = 0;
this.iconImg = 0;
this.nodeImg = 0;
this.isLastNode = 0;

// dynamic data
this.isRoot = true;
this.isOpen = true;
this.iconSrc=http://www.ddvip.net/web/php/index2/imageURL+"ftv2folderopen.gif";
this.iconRoot =http://www.ddvip.net/web/php/index2/imageURL+"ftv2folderopen.gif";

this.children = new Array;
this.nChildren = 0;

// methods
this.initialize = initializeFolder;
this.setState = setStateFolder;
this.addChild = addChild;

this.createIndex = createEntryIndex;
this.hide = hideFolder;
this.display = display;
this.renderOb = drawFolder;
this.totalHeight = totalHeight;
this.subEntries = folderSubEntries;
this.outputLink = outputFolderLink;

}

function setStateFolder(isOpen) {
var subEntries;
var totalHeight;
var fIt = 0;
var i = 0;

if(isOpen == this.isOpen)
return;

if(browserVersion == 2) {
totalHeight = 0
for(i = 0; i <this.nChildren; i++)
totalHeight = totalHeight + this.children.navObj.clip.height;
subEntries = this.subEntries();

if(this.isOpen)
totalHeight = 0 - totalHeight;

for(fIt = this.id + subEntries + 1; fIt <nEntries; fIt++)
indexOfEntries[fIt].navObj.moveBy(0, totalHeight);
}

this.isOpen = isOpen;
propagateChangesInState(this);
}

function propagateChangesInState(folder) {

var i = 0;
if(folder.isOpen) {
if(folder.nodeImg) {
if(folder.isLastNode)
folder.nodeImg.src = imageURL+"ftv2mlastnode.gif";
else
folder.nodeImg.src = imageURL+"ftv2mnode.gif";
}

if(this.isRoot)
folder.iconImg.src = imageURL+"ftv2_mail.gif";
else
folder.iconImg.src = http://www.ddvip.net/web/php/index2/imageURL+"ftv2folderopen.gif";

for(i = 0; i <folder.nChildren; i++)
folder.children.display();
}
else {
if(folder.nodeImg) {
if(folder.isLastNode)

folder.nodeImg.src = imageURL+"ftv2plastnode.gif";
else
folder.nodeImg.src = imageURL+"ftv2pnode.gif";
}

if(this.isRoot)
folder.iconImg.src = imageURL+"ftv2_mail.gif";
else
folder.iconImg.src = imageURL+"ftv2folderclosed.gif";

for(i = 0; i <folder.nChildren; i++)
folder.children.hide();
}
}

function hideFolder() {
if(browserVersion == 1) {
if(this.navObj.style.display == "none")
return;

this.navObj.style.display = "none";
}
else {
if(this.navObj.visibility == "hiden")
return;

this.navObj.visibility = "hiden";
}

this.setState(0);
}

function initializeFolder(level, lastNode, leftSide) {
var i = 0;
var j = 0;

var numberOfFolders;
var numberOfDocs;

nc = this.nChildren;
this.createIndex();

var nc;
var auxEv = "";

if(browserVersion > 0)
auxEv = "<A HREF='javascript: clickOnNode("+this.id+")'>";
else
auxEv = "<A>";

if(level > 0) {
if(lastNode) { //the last 'brother' in the children array
this.renderOb(leftSide + auxEv + "<IMG NAME='nodeIcon" + this.id + "' SRC='http://www.ddvip.net/web/php/index2/"+imageURL+"ftv2mlastnode.gif' WIDTH=16 HEIGHT=22 BORDER=0></A>");
leftSide = leftSide + "<IMG SRC='http://www.ddvip.net/web/php/index2/"+imageURL+"ftv2blank.gif' WIDTH=16 HEIGHT=22>";
this.isLastNode = 1;
}
else {
this.renderOb(leftSide + auxEv + "<IMG NAME='nodeIcon" + this.id + "'SRC='"+imageURL+"ftv2mnode.gif' WIDTH=16 HEIGHT=22 BORDER=0></A>");
leftSide = leftSide + "<IMG SRC='http://www.ddvip.net/web/php/index2/"+imageURL+"ftv2vertline.gif' WIDTH=16 HEIGHT=22>";
this.isLastNode = 0;
}
}
else {
this.renderOb("");
}

if(nc > 0) {
level = level + 1;
for(i = 0; i <this.nChildren; i++) {
if(i == this.nChildren-1)
this.children.initialize(level, 1, leftSide);
else
this.children.initialize(level, 0, leftSide);
}
}
}

function drawFolder(leftSide) {
if(browserVersion == 2) {
if(!doc.yPos)
doc.yPos = 8;

doc.write("<LAYER ID='folder" + this.id + "' TOP=" + doc.yPos + " VISIBILITY=hiden>");
}
doc.write("<TABLE")

if(browserVersion == 1)
doc.write(" ID='folder" + this.id + "' STYLE='position:block;' ");

doc.write(" BORDER=0 CELLSPACING=0 CELLPADDING=0>");
doc.write("<TR><TD>");
doc.write(leftSide);

this.outputLink();

doc.write("<IMG NAME='folderIcon" + this.id + "' ");
if(leftSide == '') {
doc.write("SRC='" + this.iconRoot+"' BORDER=0></A>");
}
else {
doc.write("SRC='" + this.iconSrc+"' BORDER=0></A>");
}

doc.write("</TD><TD NOWRAP>");

doc.write("<DIV CLASS="fldrroot">");

if(leftSide == '') {
if(USETEXTLINKS) {
this.outputLink();
doc.write('<font size="2" color="'+floderColor+'">'+this.desc + "</font></A>");
}
else
doc.write(this.desc);
}
else {
doc.write("<A  HREF='javascript: clickOnNode("+this.id+")'>");
doc.write('<font size="2" color="'+floderColor+'">'+this.desc + "</font></A>");
}

doc.write("</DIV>");
doc.write("</TD>");
doc.write("</TABLE>");

if(browserVersion == 2) {
doc.write("</LAYER>");
}

if(browserVersion == 1) {
this.navObj = doc.all["folder"+this.id];
this.iconImg = doc.all["folderIcon"+this.id]
this.nodeImg = doc.all["nodeIcon"+this.id]
}
else if(browserVersion == 2) {
this.navObj = doc.layers["folder"+this.id];
this.iconImg = this.navObj.document.images["folderIcon"+this.id];
this.nodeImg = this.navObj.document.images["nodeIcon"+this.id];
doc.yPos = doc.yPos + this.navObj.clip.height;
}
}
<BODY bgColor=#C0C693 leftMargin=5 topMargin=5 marginwidth="5" marginheight="5">
<SCRIPT language=JavaScript src="../leftfiles/treemenu.js"></SCRIPT>
<SCRIPT language=JavaScript>
//以下三项可以设置也可以按默认值，main和parent.main都是链接页面要显示的目标框架
setImageURL("images/"); //图标路径
setLinkColor("#ff0000");//叶节点链接颜色
setFloderColor("#ffff00");//树结点链接颜色

foldersTree = gFldr('***介绍','','');
aux1 = insFldr(foldersTree, "**机关",parent.main,"function.htm");
aux2 = insFldr(aux1 , "**处",parent.main,"function.htm");
insDoc(aux2 , "main", "**室","department/manage/offic.htm");
insDoc(aux2 , "main", "**室", "department/manage/employee.htm");                
insDoc(aux2 , "main", "**室","department/manage/finance.htm");

aux2 = insFldr(aux1 , "**处",parent.main,"function.htm");

insDoc(aux2 , "main", "**室","department/manage/law.htm");
insDoc(aux2 , "main", "**室","department/manage/manage.htm");
insDoc(aux2 , "main", "**室", "department/manage/custody.htm");
insDoc(aux2 , "main", "**室", "department/manage/marketmanage.htm");

aux3 = insFldr(aux2 , "**处",parent.main,"function.htm");

insDoc(aux3 , "main", "**室", "department/manage/policy.htm");
insDoc(aux3 , "main", "**室", "department/manage/disposition.htm");

aux1 = insFldr( foldersTree,"**中心",parent.main,"department/business/function.htm");
aux2 = insFldr(aux1 , "**处",parent.main,"function.htm");
insDoc(aux2 , "main", "**室","department/manage/offic.htm");
insDoc(aux2 , "main", "**室", "department/manage/employee.htm");                
insDoc(aux2 , "main", "**室","department/manage/finance.htm");

aux2 = insFldr(aux1 , "**处",parent.main,"function.htm");

insDoc(aux2 , "main", "**室","department/manage/law.htm");
insDoc(aux2 , "main", "**室","department/manage/manage.htm");
insDoc(aux2 , "main", "**室", "department/manage/custody.htm");
insDoc(aux2 , "main", "**室", "department/manage/marketmanage.htm");

aux3 = insFldr(aux2 , "**处",parent.main,"function.htm");

insDoc(aux3 , "main", "**室", "department/manage/policy.htm");
insDoc(aux3 , "main", "**室", "department/manage/disposition.htm");

initializeDocument();

</script>
function outputFolderLink() {
if(this.hreference && this.target) {
doc.write("<A HREF='" + this.hreference + "' TARGET=""+this.target.name+"" ")

if(browserVersion > 0) {
doc.write("onClick='javascript: clickOnFolder("+this.id+")'")
}
doc.write(">")
}
else
doc.write("<A>")
}

function addChild(childNode) {
selectfile[fEntries]=childNode.desc;
fEntries++;
this.children[this.nChildren] = childNode;
this.nChildren++;
return(childNode);
}

function folderSubEntries() {
var i = 0;
var se = this.nChildren;

for(i = 0; i <this.nChildren; i++) {
if(this.children.children) //is a folder
se = se + this.children.subEntries();
}

return(se)
}

// Definition of class Item (a document or link inside a Folder)

function Item(itemDescription, hreference, itemLink, itemImg,parentid) // Constructor
{
// constant data
this.desc = itemDescription
this.link = itemLink
this.hreference = hreference;
this.id =index;
this.navObj = 0;  //initialized in render()
this.iconImg = 0; //initialized in render()

// iconSrc俊 瘤沥登绰 捞固瘤 颇老阑 阿 酒捞袍俊 嘎霸 瘤沥且 荐 乐档废 茄促 (格钎)
this.iconSrc = itemImg;

// methods
this.initialize = initializeItem ;
this.createIndex = createEntryIndex;
this.hide = hideItem;
this.display = display;
this.renderOb = drawItem;
this.totalHeight = totalHeight;

this.parentid=parentid;
//alert(this.parent);
}

function hideItem() {
if(browserVersion == 1) {
if(this.navObj.style.display == "none")
return;
this.navObj.style.display = "none"
}
else {
if(this.navObj.visibility == "hiden")
return;
this.navObj.visibility = "hiden";
}
}

function initializeItem(level, lastNode, leftSide) {
this.createIndex();

if(level > 0) {
if(lastNode) { //the last 'brother' in the children array
this.renderOb(leftSide + "<IMG SRC='http://www.ddvip.net/web/php/index2/"+imageURL+"ftv2lastnode.gif' WIDTH=16 HEIGHT=22>")
leftSide = leftSide + "<IMG SRC='http://www.ddvip.net/web/php/index2/"+imageURL+"ftv2blank.gif' WIDTH=16 HEIGHT=22>"
}
else {
this.renderOb(leftSide + "<IMG SRC='http://www.ddvip.net/web/php/index2/"+imageURL+"ftv2node.gif' WIDTH=16 HEIGHT=22>")
leftSide = leftSide + "<IMG SRC='http://www.ddvip.net/web/php/index2/"+imageURL+"ftv2vertline.gif' WIDTH=16 HEIGHT=22>"
}
}
else
this.renderOb("")
}

function drawItem(leftSide) {

if(browserVersion == 2)
doc.write("<LAYER ID='item" + this.id + "' TOP=" + doc.yPos + " VISIBILITY=hiden>");

doc.write("<TABLE ");
if(browserVersion == 1)
doc.write(" ID='item" + this.id + "' STYLE='position:block;' ");
doc.write(" BORDER=0 CELLSPACING=0 CELLPADDING=0>");
doc.write("<TR><TD>");
doc.write(leftSide);

if(this.link != "") doc.write("<A  onclik='veiwFile("+this.id+")'  HREF=" + this.link + ">");
doc.write("<IMG ID='itemIcon"+this.id+"' ")
doc.write("SRC='"+this.iconSrc+"' BORDER=0>")

if(this.link != "")
doc.write("</A>");

doc.write("</TD><TD NOWRAP>");
doc.write("<DIV CLASS="fldritem">");
if(USETEXTLINKS) {
if(this.link != "")
doc.write("<A  onclick='veiwFile("+this.id+")' HREF=" + this.link + '><font size="2" color="'+linkColor+'">'+ this.desc + "</font></A>");
else
doc.write(this.desc);
}
else {
doc.write(this.desc);
}

doc.write("</DIV>");
doc.write("</TABLE>")

if(browserVersion == 2)
doc.write("</layer>");

if(browserVersion == 1) {
this.navObj = doc.all["item"+this.id]
this.iconImg = doc.all["itemIcon"+this.id]
}
else if(browserVersion == 2) {
this.navObj = doc.layers["item"+this.id];
this.iconImg = this.navObj.document.images["itemIcon"+this.id];
doc.yPos = doc.yPos+this.navObj.clip.height;
}
}

function addposition(id,str1){
if(id>0){
clickedFolder = indexOfEntries[id];
parentid=clickedFolder.parentid;
parentname=indexOfEntries[parentid];
pa=parentname.desc;
if(parentid==0)str=pa+str1;
else str='</font><font size="2" color="#8F8F8F">—></font><font size="2" color="#AA0000">'+pa+str1;
addposition(parentid,str);

}
}
var str="";
function veiwFile (msg) {
var typeLogo=typeof top.logo;
if(typeLogo=="undefined")return;
var tpyeFrame=typeof  top.logo.top1;
if(tpyeFrame=="undefined")return;
objDocument= top.logo.top1;
var folderText="";
if(msg==0)folderText=selectfile[msg];
else {
str='</font><font size="2" color="#8F8F8F">—></font></font><font size="2" color="#AA0000">'+selectfile[msg];
addposition(msg,str);
folderText=str;
}
objDocument.document.open();
objDocument.document.write('<font size="2" color="#8F8F8F"> 当前位置：  </font>  <font size="2" color="#AA0000"> '+folderText+"</font>");
objDocument.document.close();
}

// Methods common to both objects (pseudo-inheritance)
function display() {
if(browserVersion == 1)
this.navObj.style.display = "block";
else
this.navObj.visibility = "show";
}

function createEntryIndex() {
indexOfEntries[nEntries] = this;
nEntries++;
}

// total height of subEntries open
function totalHeight() { //used with browserVersion == 2
var h = this.navObj.clip.height;
var i = 0;

if(this.isOpen) { // is a folder and _is_ open
for(i = 0 ; i <this.nChildren; i++)
h = h + this.children.totalHeight();
}
return h
}

// Events

function clickOnFolder(folderId) {
var clicked = indexOfEntries[folderId];
if(!clicked.isOpen)
clickOnNode(folderId);
if(clicked.isSelected)
return;
}

function clickOnNode(folderId) {
var clickedFolder = 0;
var state = 0;
clickedFolder = indexOfEntries[folderId];
state = clickedFolder.isOpen;
if (!state){
if(clickedFolder.target)clickedFolder.target.location=clickedFolder.hreference; //点击folder时显示相关链接页面
veiwFile(folderId);
}
clickedFolder.setState(!state); //open<->close
}

function initializeDocument() {
if(doc.all)
browserVersion = 1; //IE4
else if(doc.layers)
browserVersion = 2; //NS4
else
browserVersion = 0; //other

foldersTree.initialize(0, 1, "");
//foldersTree.display();

if(browserVersion > 0) {
doc.write("<LAYER TOP="+indexOfEntries[nEntries-1].navObj.top+"> </LAYER>");

// close the whole tree
clickOnNode(0);

// open the root folder
clickOnNode(0);
}
}

// Auxiliary Functions for Folder-Treee backward compatibility
function gFldr(description, hreference,parentid,target) {
var des;
index++;
if(fEntries==0){
selectfile[fEntries]=description;
fEntries++;
}
des=description;
folder = new Folder(des, hreference,parentid,target);
return(folder);
}

function gLnk(target, description, linkData, itemImg,parentid) {
fullLink = ""

if(target == 0 ||target=="") {
if(linkData != "")
fullLink = "'"+linkData+"' TARGET="_blank"";//显示在新开的窗体中
else
fullLink = "";
}
if(target == 1) {
if(linkData != "" )
fullLink = "'"+linkData+"' TARGET="_slef"";//显示在表单所在的框架或窗体中
else
fullLink = "";
}
else if(target == 2) {
if(linkData != "")
fullLink = "'"+linkData+"' TARGET="_parent""; //显示在包含表单的框架的父框架中
else
fullLink = "";
}
else if(target == 3) {
if(linkData != "")
fullLink = "'"+linkData+"' TARGET="_top"";//显示在顶层窗体中
else
fullLink = "";
}

else {//alert(target);
if(linkData != "")
fullLink = "'"+linkData+"' TARGET="+target;//显示在target窗体中
else
fullLink = "";
}
index++; //当前节点编号

linkItem = new Item(description, linkData, fullLink, itemImg,parentid)
return linkItem
}

function insFldr(parentFolder, childFolder,target,hreference) {
var child;
var desc;
parentid=parentFolder.id;
child=gFldr(childFolder,hreference,parentid,target);
return(parentFolder.addChild(child));
}

function insDoc(parentFolder,target, description, linkData, itemImg) {
var document;
var itemImg;
itemImg=imageURL+"bu.gif";
var desc;
parentid=parentFolder.id;
document=gLnk(target, description, linkData, itemImg,parentid);
parentFolder.addChild(document);
}

function setObjDocument(msg){
if (msg!=null){
objDocument=msg;
}
}

//设置展开、收缩图片路径
function setImageURL(msg){
if (msg==null){
imageURL="../leftfiles/images/";
}else imageURL=msg;
}

//设置超链接文本颜色
function setLinkColor(msg){
linkColor=msg;
}
function setFloderColor(msg){
floderColor=msg;
}
// Global variables

USETEXTLINKS = 1;
indexOfEntries = new Array;
nEntries = 0;
index=-1;   //节点编号
doc = document;
browserVersion = 0;
selectedFolder = 0;
selectfile=new Array;
fEntries=0;
var objDocument,imageURL;
var linkColor="#085dde";
var floderColor="#292c08";
var type1=typeof top.logo;

if (type1=="undefined"){
objDocument=null;
}

if(imageURL==null){
setImageURL(imageURL);
}

将源代码和接前代码中的代码合并成一个treemenu.js文件，在在页面中引入即可