> > 文章正文
　　活动时间：日- 日
　　活动地址：
　　新学期寄语
　　9月1日0点后新注册玩家可领取，蓝钻用户可额外获得专属装
　　备。单Q限领1次。开通蓝钻亲爱的XXX:
　　开学啦！暑假没玩爽？感觉意犹未尽？没关系，老尸给你送来新装备！
　　赶快加入我们，攒学分换大礼，新学期继续嗨起来！
　　签到攒学分,惊喜天天有！
　　每日登录游戏后，到本页面签到，可获得指定学分。每获得50学分可抽奖1次。
　　活动规则
　　1凡零点后新注册玩家，均可领取新手礼包1份，蓝钻用户可获得专属礼包1份，单Q限领1次；
　　2每日登录游戏后，在本页面签到，可得对应学分。每获得50学分可抽奖1次；奖品均直接下发到账，请及时登录游戏获取；
　　3在法律许可的范围内，腾讯公司拥有对本活动的解释权。下次自动登录
现在的位置:
& 综合 & 正文
My FlyBean V1.00源代码
/***我不知道怎么上传一个附件所以只好这样了**********//******************************************************************** *
My FlyBean *
web树视图 *
胡洲 **********************************************************************//********************************************************************* * tree.js是用于显示资源的树状图，在创建树对象时，会为树指定一个图片 * 资源，缺省时图片资源在应用程序的根目录下的images/tree中，用户也可 * 以通过图片资源中的putImage方法来替换相应的图标。 * 如果节点的子节点需要动态载入，可以在节点中添加一动态载入的节点，如 * node.appendDynamicChild(url); * url是子节点资源。在子节点资源中，可以通过 *
var iframe = window.frameE *
var parentNode = iframe.treeParentN *
var node1 = parentNode.appendChild("test0", "test"); *
parentNode.appendChild("test1", "test"); *
parentNode.appendChild("test8", "test"); *
parentNode.appendChild("test9", "test"); * *
//子节点载入完毕 *
iframe.notify(); * 来动态载入子节点，注意在载入完毕时应调用notify方法来通知树动态载入 * 子节点完毕。 * 注意：一个树对象只能拥有一个根节点*********************************************************************/
/** * 树样式表对象 * Document doc 树所在的文档对象 */function TreeStyleSheet(doc){
this.doc = doc == null ? window.document :
//样式表对象
this.styleSheet = this.doc.createStyleSheet();
//样式表中的rule对象
this.rules = new Array(6);
//rule选择符
var selectors = new Array(6);
selectors[0] = "A.tree___:link";
selectors[1] = "A.tree___:visited";
//注意a元素hover的style的定义必须在visited之后
selectors[2] = "A.tree___:hover";
selectors[3] = ".tree___node_text_td";
selectors[4] = ".tree___node_text_td_mouseover";
selectors[5] = ".tree___node_text_td_selected";
//rule的cssText
var values = new Array(6);
values[0] = values[1]
= "FONT-SIZE: 12"
+ "COLOR: #000000;"
+ "TEXT-DECORATION: none";
= "FONT-SIZE: 12"
+ "COLOR: #cc0000;"
+ "TEXT-DECORATION: underline";
values[3] = values[4]
= "BORDER:"
+ "PADDING-RIGHT: 6"
+ "PADDING-LEFT: 6"
+ "PADDING-TOP: 1"
+ "HEIGHT: 19px";
values[5] = values[3] + ";BACKGROUND-COLOR: #6FACE3";
for(var i = 0; i & this.rules. i++)
//将rule加入到styleSheet
this.styleSheet.addRule(selectors[i], values[i]);
this.rules[i] = this.styleSheet.rules[i];
/********************************************
* 以下提供了获取树对象样式表中对象的方法，
* 可以通过这些方法来获取节点的样式，
* 并指定自己的样式
*******************************************/
//链接的缺省Style
this.getLinkStyle = function()
return this.rules[0];
//鼠标悬停于链接上时缺省Style
this.getLinkHoverStyle = function()
return this.rules[1];
//访问过的链接的缺省Style
this.getLinkVisitedStyle = function()
return this.rules[2];
//节点所在cell的缺省Style
this.getNodeStyle = function()
return this.rules[3];
//节点所在cell有鼠标移入时的缺省Style
this.getNodeMouseOverStyle = function()
return this.rules[4];
//节点选中时所在cell的缺省Style
this.getNodeSelectedStyle = function()
return this.rules[5];
/** * 从事件中检索出当前事件的节点 */function getTreeNode(){
var table = window.event.srcE
while(table.tagName == null || table.tagName != "TABLE")
table = table.parentN
if(table == null)
var node = table.
if(node == null)
if(node == "[object TreeNode]")
/** * 树的图标资源 * String context 应用程序名称，树的缺省时图片资源在 *
应用程序的根目录下的images/tree，访问时以 *
/context/images/tree/*.gif来访问 */function ImageList(context){
//节点图标索引
//空白图片
this.BLANK = 0;
//收缩的根节点的图标
this.ROOT_COLLAPSED_IMAGE = 1;
//展开的根节点的图标
this.ROOT_EXPANED_IMAGE = 2;
//收缩的节点（有子节点）的图标
this.NODE_COLLAPSED_IMAGE = 3;
//展开的节点（有子节点）的图标
this.NODE_EXPANED_IMAGE = 4;
//叶节点的图标
this.LEAF_IMAGE = 5;
//连接节点的枝图标资源
this.LINE = 6;
this.LINE_I = 7;
this.LINE_L = 8;
this.LINE_L_FALLEN = 9;
this.LINE_T = 10;
this.LINE_PLUS_ROOT = 11;
this.LINE_MINUS_ROOT = 12;
this.LINE_PLUS_ROOT_T = 13;
this.LINE_MINUS_ROOT_T = 14;
this.LINE_PLUS_L = 15;
this.LINE_MINUS_L = 16;
this.LINE_PLUS_T = 17;
this.LINE_MINUS_T = 18;
//图标资源的相对路径
this.imageBase = "images/tree/";
if(context != null)
if(context.charAt(context.length - 1) != "/")
this.imageBase = context + "/" + this.imageB
this.imageBase = context + this.imageB
//图标资源的URL
this.images = new Array(19);
this.images[this.BLANK]
= this.imageBase + "blank.gif";
this.images[this.ROOT_COLLAPSED_IMAGE]
= this.imageBase + "img_parent_collapsed.gif";
this.images[this.ROOT_EXPANED_IMAGE]
= this.imageBase + "img_parent_expanded.gif";
this.images[this.NODE_COLLAPSED_IMAGE]
= this.imageBase + "img_parent_collapsed.gif";
this.images[this.NODE_EXPANED_IMAGE]
= this.imageBase + "img_parent_expanded.gif";
this.images[this.LEAF_IMAGE]
= this.imageBase + "img_leaf.gif";
this.images[this.LINE]
= this.imageBase + "line.gif";
this.images[this.LINE_I]
= this.imageBase + "line_I.gif";
this.images[this.LINE_L]
= this.imageBase + "line_L.gif";
this.images[this.LINE_L_FALLEN]
= this.imageBase + "line_L2.gif";
this.images[this.LINE_T]
= this.imageBase + "line_T.gif";
this.images[this.LINE_PLUS_ROOT]
= this.imageBase + "line_plus_root.gif";
this.images[this.LINE_MINUS_ROOT]
= this.imageBase + "line_minus_root.gif";
this.images[this.LINE_PLUS_ROOT_T]
= this.imageBase + "line_plus_root_T.gif";
this.images[this.LINE_MINUS_ROOT_T]
= this.imageBase + "line_minus_root_T.gif";
this.images[this.LINE_PLUS_L]
= this.imageBase + "line_plus_L.gif";
this.images[this.LINE_MINUS_L]
= this.imageBase + "line_minus_L.gif";
this.images[this.LINE_PLUS_T]
= this.imageBase + "line_plus_T.gif";
this.images[this.LINE_MINUS_T]
= this.imageBase + "line_minus_T.gif";
* 添加图标资源到对象
* int index 图标在资源中的索引
* String src 图标的相对url
* int width 图标宽
* int heigth 图标高
this.putImage = function(index, src, width, height)
this.images[index] = this.imageBase +
var img = new Image(width, height);
img.src = this.images[index];
* 获取资源中的图标对象的src
* int index 图标在资源中的索引
this.getImage = function(index)
return this.images[index];
this.setImageBase = function(URL)
this.imageBase = url
this.getImageBase = function()
return this.imageB
/** * 构造树结点，这个函数应该由其父节点调。 * String text 节点文本 * String link 节点链接 * String id 节点id * Bean tree 树对象 * String target 节点链接的目标框架 */function TreeNode(text, link, id, tree, target){
* 节点在树中的索引 通常情况下，这个值是-1是没有意义的。
* 但也许我们想通过一个简单的值来持有（与之发生关联）这
* 个节点对象，也就是说我们可以通过这个值从树中找到它关
* 联的这个节点对象，我们可通过一个节点在树中的索引来持
* 有这个对象。注意我们应该调这个方法，而不是直接访问这
* 个属性。
this.index = -1;
this.getIndex = function()
if(this.index == -1)
this.index = this.tree.getNodeIndex();
this.tree.nodes[this.index] =
return this.
/****************************节点的家谱************************************/
* 节点所在树
this.tree =
this.getTree = function()
return this.
* 节点的父节点
this.parentNode =
this.setParentNode = function(node)
this.parentNode =
this.getParentNode = function()
return this.parentN
* 节点是否是根节点
this.isRoot = function()
return this.parentNode == this.
/****************************连接树节点的枝********************************/
this.initBranch = function()
* 连接树节点的枝图标元素
this.branch = this.tree.doc.createElement("img");
* 连接树节点的枝图标在图标资源中的索引
this.branch.index = this.tree.images.LINE_L;
this.branch.src = this.tree.images.getImage(this.branch.index);
this.branch.width = 19;
this.branch.height = 20;
//枝连接的树节点对象
this.branch.node =
* 单击枝图标事件，其结果是展开或收缩节点，
* 显示或隐藏节点的所有子节点，更改节点图标，
* 更改连接节点的树枝
this.branch.onclick = function()
var node = this.
if(node == null)
if(node.hasChild())
if(node.model)
//当前节点收缩，展开所有子节点
node.expand();
//当前节点展开，收缩所有子节点
node.collapse();
this.getBranch = function()
return this.
this.setBranchIndex = function(index)
this.branch.index =
this.changeBranch();
this.getBranchIndex = function()
return this.branch.
* 设置树枝图标
* boolean hasChild 节点是否有子节点
* boolean isLastChild 当前节点是否是其父节点的最后一个子节点
this.setBranch = function(hasChild, isLastChild)
if(hasChild == null)
hasChild = this.hasChild();
if(isLastChild == null)
isLastChild = this.getNextSibling() ==
if(isLastChild)
this.branch.index
= hasChild ? this.tree.images.LINE_PLUS_L
: this.tree.images.LINE_L;
this.branch.index
= hasChild ? this.tree.images.LINE_PLUS_T
: this.tree.images.LINE_T;
this.changeBranch();
* 改变连接节点的枝图标
* 当节点在收缩和展开时，改变它的索引
this.changeBranch = function(model)
if(model == null)
model = this.
this.branch.src = this.tree.images.getImage(this.branch.index);
this.branch.src = this.tree.images.getImage(this.branch.index + 1);
* 隐藏枝图标
this.hideBranch = function()
if(this.branch.parentNode != null)
this.branch.parentNode.width = "1";
this.branch.style.display = "none";
* 显示枝图标
this.showBranch = function()
if(this.branch.parentNode != null)
this.branch.parentNode.width = "19";
this.branch.style.display = "block";
/****************************节点的图标************************************/
this.initImage = function()
* 节点图标对象
this.image = this.tree.doc.createElement("img");
//节点收缩时的图标在资源中的索引，展开时的索引比收缩时的索引大1
this.image.index = 0;
this.image.src =
this.image.width = 16;
this.image.height = 15;
this.image.style.cursor = "hand";
this.image.node =
* 处理节点图标被单击事件
* 该事件将被处理成节点的链接被单击
this.image.onclick = function()
var node = this.
if(node == null)
node.link.click();
//载入节点图标
this.setImage(false, true);
* 设置当前节点图标模式
* boolean model 值true代表节点收缩，false代表展开
this.setImageModel = function(model)
if(model == null)
model = this.
this.image.src
= model ? this.tree.images.getImage(this.image.index)
: this.tree.images.getImage(this.image.index + 1);
* 节点收缩时的图标索引
* boolean hasChild 节点是否有子节点
* boolean refresh 图标是否更新
this.setImage = function(hasChild, refresh)
if(hasChild == null)
hasChild =
//节点收缩时的图标在资源中的索引，展开时的索引比收缩时的索引大1
this.image.index
= this.isRoot() ? this.tree.images.ROOT_COLLAPSED_IMAGE
: hasChild ? this.tree.images.NODE_COLLAPSED_IMAGE
: this.tree.images.LEAF_IMAGE;
if(refresh)
this.image.src = this.tree.images.getImage(this.image.index);
this.getImageIndex = function()
return this.image.
* 节点的复选框，如果树设置显示复选框属性，则显示
this.checkbox =
this.setChecked = function(checked)
if(this.checkbox == null)
alert("节点没有复选框，不支持的操作！");
throw new Error("节点没有复选框，不支持的操作！");
if(!(this.oncheck == null))
var result = this.oncheck.call(this.oncheck,
this, this.checkbox.checked);
if(result == false)
checked = checked == null ? false : checked ==
if(checked)
var force = this.tree.getNodeCheckForce();
if((force & 0x2) == 2)
var checkboxs
= this.getTable().getElementsByTagName("checkbox");
this.tree.setNodeCheckForce(0);
for(var i = 0; i & checkboxs. i++)
if(checkboxs[i].node == this)
checkboxs[i].node.setChecked(true);
this.tree.setNodeCheckForce(force);
if((force & 0x1) == 1)
var nodes = this.getChildNodes();
this.tree.setNodeCheckForce(0);
for(var i = 0; i & nodes. i++)
nodes[i].setChecked(true);
this.tree.setNodeCheckForce(force);
var force = this.tree.getNodeCheckForce();
if((force & 0x200) == 0x200)
var checkboxs
= this.getTable().getElementsByTagName("checkbox");
this.tree.setNodeCheckForce(0);
for(var i = 0; i & checkboxs. i++)
if(checkboxs[i].node == this)
checkboxs[i].node.setChecked(false);
this.tree.setNodeCheckForce(force);
if((force & 0x100) == 0x100)
var nodes = this.getChildNodes();
this.tree.setNodeCheckForce(0);
for(var i = 0; i & nodes. i++)
nodes[i].setChecked(false);
this.tree.setNodeCheckForce(force);
this.checkbox.checked =
this.checkbox.firstChild.src
= this.tree.getImages().getImageBase()
+ (this.checkbox.checked ? "check2.gif" : "check0.gif");
this.getChecked = function()
if(this.checkbox == null)
return this.checkbox.
/****************************节点的HTML对象********************************/
//创建节点的HTML对象
this.initTextNode = function()
* 文本节点对象
this.text = new Object();
this.text.text = this.tree.doc.createTextNode(text);
//文本节点所在的表对象
this.text.table =
//文本节点所在单元格
this.text.td =
//创建HTML表对象
this.text.table = this.tree.doc.createElement("table");
this.text.table.border = "0";
this.text.table.cellSpacing = 0;
this.text.table.cellPadding = 0;
var tbody = this.tree.doc.createElement("tbody");
var tr = this.tree.doc.createElement("tr");
//节点的图标的单元格
var imageTD = this.tree.doc.createElement("td");
imageTD.appendChild(this.image);
if(this.tree.getShowCheckbox())
//复选框单元格
var cbTD = this.tree.doc.createElement("td");
cbTD.vAlign = "middle";
cbTD.style.paddingRight = "2px";
cbTD.style.paddingLeft = "2px";
this.checkbox = this.tree.doc.createElement("checkbox");
this.checkbox.checked =
this.checkbox.node =
var view = this.tree.doc.createElement("img");
view.src = this.tree.getImages().getImageBase() + "check0.gif";
this.checkbox.onclick = function()
this.node.setChecked(!this.checked);
this.checkbox.appendChild(view);
cbTD.appendChild(this.checkbox);
tr.appendChild(cbTD);
//节点文本单元格
this.text.td = this.tree.doc.createElement("td");
this.text.td.className = "tree___node_text_td";
this.text.td.noWrap =
tr.appendChild(imageTD);
tr.appendChild(this.text.td);
tbody.appendChild(tr);
this.text.table.appendChild(tbody);
//文本节点table文档对象所属TreeNode
this.text.table.node =
* 处理节点被右击事件
this.text.table.oncontextmenu = function()
//节点对象
var node = this.
if(node == null)
if(!(node.oncontextmenu == null))
//用当前节点作参数，回调指定的方法
return node.oncontextmenu.call(node.oncontextmenu, node);
this.setNodeValue = function(text)
this.text.text.nodeValue =
this.getNodeValue = function()
return this.text.text.nodeV
/****************************节点的链接************************************/
this.initLink = function()
this.link = this.tree.doc.createElement("a");
if(link == null)
this.link.disabled =
this.link.href = link == null ? "null" :
* 链接的目标框架属性
this.link.target =
this.link.className="tree___";
//链接所属节点
this.link.node =
//链接的文本
this.link.appendChild(this.text.text);
//添加链接对象到文本节点
this.text.td.appendChild(this.link);
* 处理文本节点所在单元格上鼠标移动事件
this.link.onmouseover = function()
var td = this.parentN
var node = this.
if(node == null)
if(node.getDynamicChildFlagNode())
//节点是动态载入资源提示节点
td.className = "tree___node_text_td_mouseover";
this.link.onmouseout = function()
var td = this.parentN
var node = this.
if(node == null)
if(node.getDynamicChildFlagNode())
//节点是动态载入资源提示节点
if(node.getSelected())
td.className = "tree___node_text_td_selected";
td.className = "tree___node_text_td";
* 处理节点被单击事件
this.link.onclick = function()
if(this.href == "null")
this.blur();
var node = this.
if(node == null)
if(!(node.onclick == null))
//用当前节点作参数，回调指定的方法
var result = node.onclick.call(node.onclick, node);
if(result == false)
//事件被取消
//节点所在的树
var tree = node.
if(node.getDynamicChildFlagNode())
//节点是动态载入资源提示节点
this.parentNode.className = "tree___node_text_td_selected";
if(!(tree.currentSelectedNode == null))
tree.currentSelectedNode.text.td.className = "tree___node_text_td";
tree.currentSelectedNode.setSelected(false);
tree.currentSelectedNode =
node.setSelected(true);
this.blur();
this.setLink = function(link)
this.link.href =
this.getLink = function()
return this.link.
this.setTarget = function(target)
this.link.target = target == null ? "" :
this.getTarget = function()
return this.link.
/****************************节点的状态************************************/
* model为true时，节点收缩，为false时，节点展开
this.model =
this.getModel = function()
return this.
//节点是否被选中
this.selected =
this.setSelected = function(selected)
this.selected =
this.getSelected = function()
return this.
/****************************节点视图***************************************/
//节点的表对象
this.table =
this.getTable = function()
return this.
this.tbody =
this.setID = function(id)
this.table.id = this.
this.getID = function()
return this.
* 初使化视图
this.initView = function()
//创建连接节点的树枝
this.initBranch();
//创建节点的图标
this.initImage();
//创建节点的文本
this.initTextNode();
this.initLink();
//创建HTML表对象
this.table = this.tree.doc.createElement("table");
this.table.border = "0";
this.table.cellSpacing = 0;
this.table.cellPadding = 0;
if(this.id != null)
this.table.id = this.
this.tbody = this.tree.doc.createElement("tbody");
var tr = this.tree.doc.createElement("tr");
//连接节点的枝图标的单元格
var tdBranch = this.tree.doc.createElement("td");
tdBranch.width = 19;
tdBranch.height = 20;
tdBranch.appendChild(this.branch);
//节点的单元格
var tdNode = this.tree.doc.createElement("td");
tdNode.height = 20;
tdNode.vAlign = "bottom";
tdNode.appendChild(this.text.table);
tr.appendChild(tdBranch);
tr.appendChild(tdNode);
this.tbody.appendChild(tr);
this.table.appendChild(this.tbody);
//表格所属节点对象
this.table.node =
return this.
/****************************子节点***************************************/
this.children = new Object();
//子节点数
this.children.count = 0;
//第一个子节点
this.children.firstChild =
this.getFirstChild = function()
return this.children.firstC
//最后一个子节点
this.children.lastChild =
this.getLastChild = function()
return this.children.lastC
//子节点所在节点表对象中的行，收缩节点时，该对象将被隐藏
this.children.tr =
//子节点容器
this.children.td =
* 连接下一个节点的树枝的单元格
* 当节点有子节点时，这个属性才有意义
this.branchToNextNodeTD =
* 节点的兄节点
this.previousSibling =
this.getPreviousSibling = function()
return this.previousS
* 节点的弟节点
this.nextSibling =
this.getNextSibling = function()
return this.nextS
* 设置节点连接弟节点的树枝
* boolean hasNextSibling 是否有弟节点
this.setBranchToNext = function(hasNextSibling)
if(hasNextSibling == null)
hasNextSibling = !(this.nextSibling == null);
//设置兄弟间树枝
if(hasNextSibling == true)
this.branchToNextNodeTD.background
= this.tree.images.getImage(this.tree.images.LINE_I);
this.branchToNextNodeTD.background =
* 节点是否有子节点
this.hasChild = function()
return this.children.firstChild !=
* 子节点个数
this.getChildCount = function()
return this.children.
* 返回所有子节点对象
this.getChildNodes = function()
var nodes = new Array(this.children.count);
var index = 0;
var node = this.getFirstChild();
while(node != null)
nodes[index++] =
node = node.getNextSibling();
* 添加一个子节点到当前节点
* Object obj 如果这个参数是字符串，则视为节点的文本，它和其他参数一起作为
树节点的参数。如果参数是Node或TreeNode对象，则将其添加到当前
树节点，且忽略其他参数。
* String link 子节点的链接
* String id 子节点的id
* String target 子节点的链接的目标框架
* return 返回加入的子节点
* 注意：如果当前节点准备动态载入子节点，则该操作将使当前节点不再动态载入子
this.appendChild = function(obj, link, id, target)
if(obj == null)
//子节点对象
var node =
//节点的文本
var text =
if(obj == "[object TreeNode]")
if(obj.getTree() != this.getTree())
var message = "节点与其准父节点不属于同一个树对象";
alert(message);
throw new Error(message);
if(obj.getParentNode() != null)
var message = "当前节点已有父节点不能添加到其他节点下";
alert(message);
throw new Error(message);
if(this.children.count == 0)
if(this.isRoot())
//设置根节点树枝
this.setBranchIndex(this.tree.images.LINE_PLUS_ROOT);
//根节点有子节点，显示树枝
this.showBranch();
//设置节点树枝
this.setBranch(true);
//更新图标
this.setImage(true, true);
if(this.children.tr == null)
//创建子节点容器
this.createChildrenTD();
if(target == null)
target = this.link.
//子节点的table文档对象
if(node == null)
//节点不存在，创建之
node = new TreeNode(text, link, id, this.tree, target);
//初始化子节点的文档对象
ct = node.initView();
ct = node.getTable();
node.parentNode =
//设置树枝
node.setBranch(null, true);
if(node.hasChild())
if(this.getNextSibling() != null)
//设置兄弟间树枝
this.setBranchToNext(true);
//添加子节点的table文档对象到当前节点的文档对象中
this.children.td.appendChild(ct);
this.children.count++;
node.parentNode =
//当前节点的最后一个子节点
var lastChild = this.children.lastC
if(lastChild != null)
if(lastChild.getDynamicChildFlagNode())
//最后一个子节点是动态子节点提示符，删之
this.children.td.removeChild(lastChild.table);
this.children.count--;
this.children.firstChild =
//设置节点的兄节点
node.previousSibling = lastC
//最后一个节点的弟节点
lastChild.nextSibling =
//设置最后一个节点的树枝
lastChild.setBranch();
if(lastChild.hasChild())
//设置兄弟间树枝
lastChild.setBranchToNext(true);
//第一个子节点
if(this.children.firstChild == null)
this.children.firstChild =
//最后一个子节点
this.children.lastChild =
* 动态子节点提示符节点
this.dynamicChildFlagNode =
this.setDynamicChildFlagNode = function(flag)
this.dynamicChildFlagNode
= flag == null ? false : flag ==
if(this.dynamicChildFlagNode == true)
if(!(this.checkbox == null))
this.checkbox.parentNode.removeChild(this.checkbox);
this.getDynamicChildFlagNode = function()
return this.dynamicChildFlagN
* 为当前节点添加动态子节点
* String link 动态子节点资源的URL
this.appendDynamicChild = function(link)
var node = this.appendChild("正在载入资源...", link);
node.setDynamicChildFlagNode(true);
node.image.style.display = "none";
node.link.disabled =
//树中有动态子节点
this.tree.hasDynamicNode =
* 创建子节点容器
this.createChildrenTD = function()
this.children.tr = this.tree.doc.createElement("tr");
//隐藏所有子节点
this.children.tr.style.display = "none";
//节点连接其弟节点的树枝
this.branchToNextNodeTD = this.tree.doc.createElement("td");
if(!this.isRoot()
&& this.parentNode != null
&& !(this.nextSibling == null))
//当前节点并不是其父节点的最后一个子节点
//设置兄弟间树枝
this.setBranchToNext(true);
//子节点的容器
this.children.td = this.tree.doc.createElement("td");
this.children.tr.appendChild(this.branchToNextNodeTD);
this.children.tr.appendChild(this.children.td);
this.tbody.appendChild(this.children.tr);
/****************************操作节点**************************************/
* 展开节点
* boolean deep 是否展开子节点
this.expand = function(deep)
if(this.onexpand != null)
//用当前节点作参数，回调指定的方法
var result = this.onexpand.call(this.onexpand, this);
if(result == false)
//事件被取消
if(this.hasChild())
if(this.model)
//当前节点收缩，展开所有子节点
//更新节点树枝
this.changeBranch(false);
//节点图标
this.setImageModel(false);
//显示所有子节点
this.children.tr.style.display = "block";
this.model =
if(this.getLastChild().getDynamicChildFlagNode())
this.tree.loadDynamicNodes(this);
if(this.tree.hasDynamicNode)
//有动态子节点，不可深度展开
//展开子节点
var nodes = this.getChildNodes();
for(var i = 0; i & nodes. i++)
nodes[i].expand(true);
* 收缩节点
this.collapse = function()
if(this.oncollapse != null)
//用当前节点作参数，回调指定的方法
var result = this.oncollapse.call(this.oncollapse, this);
if(result == false)
//事件被取消
if(this.hasChild())
if(!this.model)
//当前节点展开，收缩所有子节点
//更新节点树枝
this.changeBranch(true);
//节点图标
this.setImageModel(true);
//显示所有子节点
this.children.tr.style.display = "none";
this.model =
* 选中节点
this.select = function select()
this.link.click();
* 用户自定义的数据对象，如果在克隆节点时
* 需克隆这个对象，则该对象应提供方法clone，
* 该方法返回一个对象的克隆。如果对象中没
* 有提供clone方法，则在克隆节点时，将克隆
* 一个对本对象的引用
this.userObject =
this.setUserObject = function setUserObject(obj)
this.userObject =
this.getUserObject = function getUserObject()
return this.userO
* 对象信息
this.toString = function()
return "[object TreeNode]";
this.valueOf = function()
return "[object TreeNode]";
* 删除节点的子节点
* TreeNode child 子节点
* return 返回删除的子节点
this.removeChild = function(child)
if(child == null)
if(child.getParentNode() != this)
//要删除的节点并不是当前节点的子节点
//父节点设置为null
child.parentNode =
//child节点的table文档对象
var ct = child.
//从文档Document中删除child节点的文档对象
ct.parentNode.removeChild(ct);
if(child.hasChild())
child.setBranchToNext(false);
//子节点的兄弟节点处理
var node = child.previousS
if(node != null)
node.nextSibling = child.nextS
node.setBranch();
if(child.nextSibling == null)
//兄节点枝处理
if(node.hasChild())
node.setBranchToNext(false);
node = child.nextS
if(node != null)
node.previousSibling = child.previousS
//节点的子节点链处理
if(this.getFirstChild() == child)
this.children.firstChild = child.nextS
if(this.getLastChild() == child)
this.children.lastChild = child.previousS
child.nextSibling =
child.previousSibling =
this.children.count--;
if(this.children.count == 0)
//已经没有子节点
//节点图标
this.setImage(false, true);
//显示所有子节点
this.children.tr.style.display = "none";
//节点当前收缩
this.model =
//删除节点连接其弟节点的延长枝
this.setBranchToNext(false);
//设置节点树枝
this.setBranch();
//删除节点在树中的引用，释放资源
child.release();
//当前选中的节点
if(this.tree.currentSelectedNode == child)
this.tree.currentSelectedNode =
child.text.td.className = "tree___node_text_td";
child.setSelected(false);
* 删除节点在树中的引用，释放资源
this.release = function()
var nodes = this.getChildNodes();
for(var i = 0; i & nodes. i++)
nodes[i].release();
if(this.index != -1)
this.getTree().nodes[this.index] =
* 克隆节点，并返回新结点
* boolean deep 是否克隆其子节点
* return 返回新节点
this.cloneNode = function(deep)
if(deep == null)
var text = this.getNodeValue();
var link = this.getLink();
var id = this.getID();
var target = this.getTarget();
var newNode = new TreeNode(text, link, id, this.tree, target);
newNode.initView();
//clone其他数据
newNode.setChecked(this.getChecked());
if(!(this.userObject == null))
if(!(this.userObject.clone == null))
newNode.userObject
= this.userObject.clone.call(this.userObject);
newNode.userObject = this.userObject
if(this.dynamicChildFlagNode == true)
newNode.dynamicChildFlagNode =
if(deep == true)
if(this.hasChild())
var nodes = this.getChildNodes();
for(var i = 0; i & nodes. i++)
var newChildNode = nodes[i].cloneNode(true);
newNode.appendChild(newChildNode);
if(this.model == false)
newNode.expand();
newNode.onclick = this.
newNode.oncontextmenu = this.
newNode.onexpand = this.
newNode.oncollapse = this.
newNode.oncheck = this.
return newN
* 插入子节点
* TreeNode newChild 要插入的子节点
* TreeNode refChild 要插入的子节点就是插入到这个节点之前，
如果其为null，则要插入的子节点添加到当
前节点的末尾
* return 返回插入的新节点
this.insertBefore = function(newChild, refChild)
if(newChild == null)
if(refChild == null)
this.appendChild(newChild);
if(newChild.getTree() != this.getTree())
var message = "节点与其准父节点不属于同一个树对象";
alert(message);
throw new Error(message);
if(newChild.getParentNode() != null)
var message = "节点已有父节点不能添加到其他节点下";
alert(message);
throw new Error(message);
if(newChild.hasChild())
//设置兄弟间树枝
newChild.setBranchToNext(true);
newChild.setBranch(null, false);
if(refChild.previousSibling == null)
this.children.firstChild = newC
refChild.previousSibling.nextSibling = newC
newChild.previousSibling = refChild.previousS
refChild.previousSibling = newC
newChild.nextSibling = refC
newChild.parentNode =
this.children.count++;
//树节点的文档对象插入
var pn = refChild.getTable().parentN
pn.insertBefore(newChild.getTable(), refChild.getTable());
return newC
* 替换子节点
* TreeNode newChild 新的子节点
* TreeNode oldChild 将被替换的子节点
* return 返回新的节点
this.replaceChild = function(newChild, oldChild)
if(oldChild == null)
if(oldChild == newChild)
return newC
this.insertBefore(newChild, oldChild);
this.removeChild(oldChild);
return newC
* 单击节点事件的处理方法，其定义可能是：function(node)
* 事件处理器将把当前被单击的节点作为第一个参数传入这个方法
* 如果这个方法返回false，事件将被取消
this.onclick =
* 鼠标右击节点事件的处理方法，其定义可能是：function(node)
* 事件处理器将把当前被右击的节点作为第一个参数传入这个方法
* 如果这个方法返回false，事件将被取消
this.oncontextmenu =
* 展开节点事件的处理方法，其定义可能是：function(node)
* 事件处理器将把发生事件的节点作为第一个参数传入这个方法
* 如果这个方法返回false，事件将被取消
this.onexpand =
* 收缩节点事件的处理方法，其定义可能是：function(node)
* 事件处理器将把发生事件的节点作为第一个参数传入这
【上篇】【下篇】