XML+Javascript树状菜单

 

var ImgArr = new Array();
var level = 0;
var vid = 0;
var HTML = "";
var img = "";
function getSubject() {
 var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
 xmlDoc.async = false;
 xmlDoc.load("Work.xml");
 if (xmlDoc.parseError.errorCode != 0) {
  alert(xmlDoc.parseError.reason);
  return;
 } else {
  var nodes = xmlDoc.documentElement.childNodes;
  for (var i = 0; i < nodes.length; i++) {
   img = "";
   if (nodes(i).nodeName == "tree") {
    vid++;
    if (i == nodes.length - 1) {
     ImgArr[level] = "<img src='images/L+.gif' + vid + "' " + vid + "')>";
     img = ImgArr[level];
     readTree(nodes(i), true);
    } else {
     ImgArr[level] = "<img src='images/T+.gif' + vid + "' " + vid + "')>";
     img = ImgArr[level];
     readTree(nodes(i), false);
    }
   } else {
    if (nodes(i).nodeName == "node") {
     img = "<img src='images/T.gif'>";
     if (i == nodes.length - 1) {
      img = "<img src='images/L.gif'>";
     }
     readNode(nodes(i));
    }
   }
  }
 }
 delete (xmlDoc);
 window.left.innerHTML = HTML;
 return;
}
function readTree(cI, sp) {
 var nodes = cI.childNodes;
 var menuHTML = img;
 menuHTML += "<img src='images/";
 menuHTML += cI.selectNodes("image")(0).text;
 menuHTML += "'>";
 menuHTML += "<a href='";
 if (cI.selectNodes("link")(0).text != "") {
  menuHTML += cI.selectNodes("link")(0).text;
 } else {
  menuHTML += "#";
 }
 if (cI.selectNodes("target")(0).text != "") {
  menuHTML += "' target='" + cI.selectNodes("target")(0).text;
 }
 menuHTML += "' " + vid + "')";
 menuHTML += " title='";
 menuHTML += cI.selectNodes("title")(0).text;
 menuHTML += "'>";
 menuHTML += cI.selectNodes("text")(0).text;
 menuHTML += "</a><br>/n";
 HTML += menuHTML;
 HTML += "<div + vid + "' style='display:none'>/n";
 ImgArr[level] = "<img src='images/i.gif'>";
 if (sp) {
  ImgArr[level] = "<img src='images/white.gif'>";
 }
 for (var i = 0; i < nodes.length; i++) {
  level++;
  ImgArr[level] = "<img src='images/i.gif'>/n";
  if (sp) {
   ImgArr[level] = "<img src='images/white.gif'>/n";
  }
  img = "";
  var tempImg = "";
  for (var j = 0; j < level; j++) {
   tempImg += ImgArr[j];
  }
  img = tempImg;
  if (nodes(i).nodeName == "tree") {
   vid++;
   if (i == nodes.length - 1) {
    img += "<img src='images/L+.gif' + vid + "' " + vid + "')>";
    readTree(nodes(i), true);
   } else {
    img += "<img src='images/T+.gif' + vid + "' " + vid + "')>";
    readTree(nodes(i), false);
   }
   img = "";
  } else {
   if (nodes(i).nodeName == "node") {
    if (i == nodes.length - 1) {
     img += "<img src='images/L.gif'>";
    } else {
     img += "<img src='images/T.gif'>";
    }
    readNode(nodes(i));
   }
  }
  level--;
 }
 HTML += "</div>/n";
 return;
}
function readNode(cI) {
 //alert("ok");
 var nodeHTML = img;
 nodeHTML += "<img src='images/";
 nodeHTML += cI.selectNodes("image")(0).text;
 nodeHTML += "'>";
 nodeHTML += "<a href='";
 nodeHTML += cI.selectNodes("link")(0).text;
 if (cI.selectNodes("target")(0).text != "") {
  nodeHTML += "' target='" + cI.selectNodes("target")(0).text;
 }
 nodeHTML += "' title='";
 nodeHTML += cI.selectNodes("title")(0).text;
 nodeHTML += "'>";
 nodeHTML += cI.selectNodes("text")(0).text;
 nodeHTML += "</a><br>/n";
 HTML += nodeHTML;
 return;
}
function divshow(vid) {
 if (document.all["div" + vid].style.display == "none") {
  document.all["div" + vid].style.display = "";
  document.all["f" + vid].src = document.all["f" + vid].src.replace("+", "-");
 } else {
  document.all["div" + vid].style.display = "none";
  document.all["f" + vid].src = document.all["f" + vid].src.replace("-", "+");
 }
 return;
}

<?xml version="1.0" encoding="gb2312"?>
<treeview>
 <tree >
  <text>通道管理</text>
  <target>workMain</target>
  <title>通道管理</title>
  <link>smsc.list</link>
  <image>tongdao.gif</image>
  <node>
   <text>通道列表</text>
   <target>workMain</target>
   <title>所有通道</title>
   <link>smsc.list</link>
   <image>list.gif</image>
  </node>
  <node>
   <text>添加通道</text>
   <target>workMain</target>
   <title>添加通道</title>
   <link>smsc.addtd</link>
   <image>html.gif</image>
  </node>
 </tree>
 <tree >
  <text>参数管理</text>
  <target>workMain</target>
  <title>参数管理</title>
  <link>smsc.manager</link>
  <image>sys.gif</image>
  <node>
   <text>系统设置</text>
   <target>workMain</target>
   <title>系统设置</title>
   <link>smsc.sysset</link>
   <image>html.gif</image>
  </node>
  <node>
   <text>通道设置</text>
   <target>workMain</target>
   <title>通道设置</title>
   <link>smsc.tdset</link>
   <image>html.gif</image>
  </node>
 </tree>
 <node>
  <text>权限管理</text>
  <target>workMain</target>
  <title>设置用户访问权限</title>
  <link>smsc.userAccess</link>
  <image>set.gif</image>
 </node>
 <tree >
  <text>插件管理</text>
  <target>workMain</target>
  <title>插件管理</title>
  <link>smsc.plugManager</link>
  <image>pulg.gif</image>
  <node>
   <text>编辑</text>
   <target>workMain</target>
   <title>编辑</title>
   <link>smsc.plugE</link>
   <image>html.gif</image>
  </node>
  <node>
   <text>插件平台</text>
   <target>workMain</target>
   <title>插件平台</title>
   <link>smsc.plugL</link>
   <image>html.gif</image>
  </node>
 </tree>
 <tree >
  <text>ctc021</text>
  <target>workMain</target>
  <title>ctc021管理</title>
  <link>smsc.sysset</link>
  <image>folder.gif</image>
  <node>
   <text>ctc021</text>
   <target>workMain</target>
   <title>ctc021</title>
   <link>smsc.main?name=ctc025</link>
   <image>html.gif</image>
  </node>
  <node>
   <text>ctc021日志</text>
   <target>workMain</target>
   <title>ctc021日志</title>
   <link>smsc.log?name=ctc021</link>
   <image>html.gif</image>
  </node>
 </tree>
 <tree >
  <text>cnc025</text>
  <target>workMain</target>
  <title>cnc025管理</title>
  <link>smsc.sysset</link>
  <image>folder.gif</image>
  <node>
   <text>cnc025</text>
   <target>workMain</target>
   <title>cnc025</title>
   <link>smsc.main?name=ctc025</link>
   <image>html.gif</image>
  </node>
  <node>
   <text>cnc025日志</text>
   <target>workMain</target>
   <title>cnc025日志</title>
   <link>smsc.log?name=ctc025</link>
   <image>html.gif</image>
  </node>
 </tree>
 <node>
  <text>修改管理员密码</text>
  <target>workMain</target>
  <title>修改管理员登录系统密码</title>
  <link>smsc.resetPassword</link>
  <image>set.gif</image>
 </node>
</treeview>