TREE!!

此树使用脚本语言JS，dojo组件,DOM API，WebFx 的树控件XTree.
使用DOJO组件从XML文件中读取所有数据，并且DOM API配合XTREE 对内存中的数据操作，一次性生成树。
流程:
代码片断:
1. 使用dojo组件从xml文件读取数据.

	loadTreeMenu:function() {
		var treeMenuLoader = this;
		var menu = 'me';
		var par = window.location.search;
		if (par.length != 0)
			menu = par.substring(7, (par.length - 1));
		var url = "tree.xml";
		var bindArgs = {
			url: url,
			mimetype: "text/xml",
			method: "post",
			content: {'menu': menu},
			load: function(type, data, evt){
				treeMenuLoader.treeMenuData = data.selectSingleNode('/MenuConfig/Menu[@id="' + menu + '"]');
				treeMenuLoader.rendTree.call(treeMenuLoader);
} 
		};
		dojo.io.bind(bindArgs);
	},

2. 编写rendTree和addItem 两个方法对返回的数据操作, 结合使用WebFx 的树控件XTree生成树.
代码片断:

rendTree: function() {
		var treeMenuLoader = this;
		var treeMenuData = treeMenuLoader.treeMenuData;
		var webFXTreeConfig = {
			usePersistence:true
		};
		var tree = new WebFXTree('root', treeMenuData.getAttribute("title"), '', '', treeMenuData.getAttribute("image"), treeMenuData.getAttribute("image"));
		var childNodesData = treeMenuData.selectNodes('Item');
		dojo.lang.forEach(childNodesData, function(childNodeData) {
			treeMenuLoader.addItem(tree, childNodeData);
		});
		dojo.byId('menuTree').innerHTML = tree;
	},
	addItem:function(tree, node) {
		var treeMenuLoader = this;
		var sText = node.getAttribute('title');
		var id = node.getAttribute('id');
		var sAction = node.getAttribute('page');
		var sTarget = node.getAttribute('target');
		if(sTarget == null)
			sTarget = 'mainFrame';
		var sTip = node.getAttribute('toolTip');
		var sIcon = node.getAttribute('image');
		var item = new WebFXTreeItem(id, sText, sAction, sTarget, sTip, null, sIcon, sIcon);
		var nodes = node.selectNodes('Item');
		dojo.lang.forEach(nodes, function(node) {
			treeMenuLoader.addItem(item, node);
		});
		tree.add(item);
	}

大家可以下载附件,说明和例子全都有....希望大家发表评论.我好吸取经验..