ztree系列之：如何动态更新节点数据(名称、图标、字体、颜色等)

[ 摘要]： 在使用ztree树控件的过程中，需要动态更新ztree节点数据的需求应该也不少。那么针对ztree的节点数据更新到底提供了哪些方法呢？ 我们需要更新节点数据的前提是我们要获取到所要更新的节点对象。 1、如果是更新所有的节点，那么可以这样拿到ztree的所有node对象 var zTree = $.fn.zTree.getZTreeObj("treeDemo"); var nodes = zTree.getNodes(); 2、如果是之获取选中节点，那么可以这样 var zTree = $.fn.zTree.getZTreeObj("treeDemo"); var nodes = zTree.getSelectedNodes(); 节点对象我们获取到了，那么接下来应该...

在使用ztree树控件的过程中，需要动态更新ztree节点数据的需求应该也不少。那么针对ztree的节点数据更新到底提供了哪些方法呢？

我们需要更新节点数据的前提是我们要获取到所要更新的节点对象。

1、如果是更新所有的节点，那么可以这样拿到ztree的所有node对象

view source print ?

1. var zTree = $.fn.zTree.getZTreeObj("treeDemo");

2. var nodes = zTree.getNodes();

2、如果是之获取选中节点，那么可以这样

view source print ?

1. var zTree = $.fn.zTree.getZTreeObj("treeDemo");

2. var nodes = zTree.getSelectedNodes();

节点对象我们获取到了，那么接下来应该通过何种方法进行节点数据更新呢？

1、更新节点名称

view source print ?

1. for(var i = 0;i<nodes.length;i++)

2. {

3. nodes[i].name = "修改后的节点名称";

4. //调用updateNode(node)接口进行更新

5. zTree.updateNode(nodes[i]);

6. }

2、更新节点前的图标

view source print ?

1. for(var i = 0;i<nodes.length;i++)

2. {

3. nodes[i].iconSkin= "icon01";

4. //调用updateNode(node)接口进行更新

5. zTree.updateNode(nodes[i]);

6. }

3、更新节点字体颜色值

view source print ?

01. for(var i = 0;i<nodes.length;i++)

02. {

03. var  color = [0, 0, 0];

04. var r1 = Math.round(Math.random()*3 - 0.5);

05. color[r1] = 15;

06. var r2 = Math.round(Math.random()*3 - 0.5);

07. while (r2 === r1) {

08. r2 = Math.round(Math.random()*3 - 0.5);

09. }

10. color[r2] = Math.round(Math.random()*16-0.5);

11. zTree.setting.view.fontCss["color"] = "#"+color[0].toString(16)+color[1].toString(16)+color[2].toString(16);

12. //调用updateNode(node)接口进行更新

13. zTree.updateNode(nodes[i]);

14. }

4、更新节点字体样式

view source print ?

1. for(var i = 0;i<nodes.length;i++)

2. {

3. var style = (style=="italic" ? "normal" : "italic");

4. zTree.setting.view.fontCss["font-style"] = style;

5. //调用updateNode(node)接口进行更新

6. zTree.updateNode(nodes[i]);

7. }

以上就是关于如何更新ztree树组件节点信息的相关方法汇总。