[ 来源:www.it55.com | 作者: | 时间:2007-07-12 | 收藏 | 推荐 ] 【大 中 小】
最近看到大家都练习写树,偶也学习学习写了一个,大家多多批评,我好进步。不过我看了一些树的xml文档都是在xml中就已经有了树的结构,所以我写了一个xml文档不用分层,来生成树的,不过要给每个节点定义编号和父编号。
写得有点糙,大家不要笑话,以后逐渐学习在改进。 IT资讯之家 www.it55.com
演示地址: www.lapuasi.com/javascript/xmltree 免费资源www.it55.com
使用方法:
var tree = new xmlTree('tree'); //生成对象
tree.mode = 1; //设置初始模式,默认全部关闭。0全部关闭,1全部展开
tree.createTree(); //输出树
Javascript代码:
/* JavaScript Document */ IT资讯之家 www.it55.com
/*
xmlTree v1.2
=================================
Infomation
----------------------
Author : Lapuasi
E-Mail : lapuasi@gmail.com
WebSite : http://www.lapuasi.com/javascript
DateTime : 2005-12-25
Example
----------------------
var tree = new xmlTree('tree'); //生成对象
tree.mode = 1; //设置初始模式,默认全部关闭。0全部关闭,1全部展开
tree.createTree(); //输出树
for Internet Explorer, Mozilla Firefox
*/
function xmlTree(name) {
this.name = name; //实例名称
this.xmlFile = 'xmltree.xml'; //默认xml文件
this.iconPath = 'images/' //默认图标路径
this.iconFolder = 'tree_icon_folder.gif'; //默认文件夹图标 免费资源www.it55.com
this.iconFile = 'tree_icon_file.gif'; //默认文件图标
this.iconOpen = 'tree_arrow_open.gif'; //默认箭头展开图标
this.iconOver = 'tree_arrow_over.gif'; //默认箭头活动图标
this.iconClose = 'tree_arrow_close.gif'; //默认箭头关闭图标
this.mode = 0; //初始模式,默认全部关闭。0全部关闭,1全部展开
this.html = ''; //最终输出html代码
this.prevTip = null; //上一次被显示的tip的时间编号 (内部使用) 45398 www.it55.com it55学习IT知识,享受IT生活 4dfkjn
this.prevSelected = null; //上一次被选中的节点的自动编号 (内部使用)
}
xmlTree.prototype.createXMLDOM = function() { //生成XMLDOM对象
var xmldom;
if (window.ActiveXObject){
var xmldom = new ActiveXObject("Microsoft.XMLDOM");
} else {
if (document.implementation && document.implementation.createDocument) {
var xmldom = document.implementation.createDocument("","doc",null);
}
}
xmldom.async = false;
xmldom.resolveExternals = false;
xmldom.validateOnParse = false;
xmldom.preserveWhiteSpace = true;
return xmldom;
}
xmlTree.prototype.createTree = function() { //生成并打印
var xmldom = this.createXMLDOM();
document.write('<div id="tree"><\/div>'); // 树所用层
document.write('<div id="treeTip"><\/div>'); //提示所用层 sflj www.it55.com kg^&fgd
document.getElementById('treeTip').style.visibility = 'visible';
document.getElementById('treeTip').style.display = 'none';
if (xmldom.load(this.xmlFile)) {
this.createNodes(xmldom);
} else {
this.html = 'Load XML Error';
}
document.getElementById('tree').innerHTML = this.html;
return;
}
xmlTree.prototype.getFirstChildData = function(obj, name) { //取得指定名称节点的第一个子节点的数据
var result = '';
if (typeof(obj) == 'object' && name != null && name != '') {
var node = obj.getElementsByTagName(name);
if (node != null && node.length > 0) {
result = node[0].firstChild.data;
}
}
return result;
}
xmlTree.prototype.checkChildNodes = function(obj, id) { //检测是否有分支
var result = false;
var nodes = obj.getElementsByTagName('node');
(阅读次数:)