文档章节

id pid格式json数据,生成树算法

 开天88
发布于 2016/12/02 08:39
字数 459
阅读 14
收藏 0

test.html

<script>
function transformTozTreeFormat(setting, sNodes) {
var i,l,
key = setting.idKey,
parentKey = setting.parentKey,
childKey = setting.childKey;
if (!key || key=="" || !sNodes) return [];



var r = [];
var tmpMap = {};
for (i=0, l=sNodes.length; i<l; i++) {
tmpMap[sNodes[i][key]] = sNodes[i];
}
for (i=0, l=sNodes.length; i<l; i++) {
if (tmpMap[sNodes[i][parentKey]] && sNodes[i][key] != sNodes[i][parentKey]) {
if (!tmpMap[sNodes[i][parentKey]][childKey])
tmpMap[sNodes[i][parentKey]][childKey] = [];
tmpMap[sNodes[i][parentKey]][childKey].push(sNodes[i]);
} else {
r.push(sNodes[i]);
}
}
return r;

}
var setting={idKey:'id',parentKey:'pId',childKey:'children'};

var zNodes =[
{ id:1, pId:0, name:"父节点1 - 展开", open:true},
{ id:11, pId:1, name:"父节点11 - 折叠"},
{ id:111, pId:11, name:"叶子节点111"},
{ id:112, pId:11, name:"叶子节点112"},
{ id:113, pId:11, name:"叶子节点113"},
{ id:114, pId:11, name:"叶子节点114"},
{ id:12, pId:1, name:"父节点12 - 折叠"},
{ id:121, pId:12, name:"叶子节点121"},
{ id:122, pId:12, name:"叶子节点122"},
{ id:123, pId:12, name:"叶子节点123"},
{ id:124, pId:12, name:"叶子节点124"},
{ id:13, pId:1, name:"父节点13 - 没有子节点", isParent:true},
{ id:2, pId:0, name:"父节点2 - 折叠"},
{ id:21, pId:2, name:"父节点21 - 展开", open:true},
{ id:211, pId:21, name:"叶子节点211"},
{ id:212, pId:21, name:"叶子节点212"},
{ id:213, pId:21, name:"叶子节点213"},
{ id:214, pId:21, name:"叶子节点214"},
{ id:22, pId:2, name:"父节点22 - 折叠"},
{ id:221, pId:22, name:"叶子节点221"},
{ id:222, pId:22, name:"叶子节点222"},
{ id:223, pId:22, name:"叶子节点223"},
{ id:224, pId:22, name:"叶子节点224"},
{ id:23, pId:2, name:"父节点23 - 折叠"},
{ id:231, pId:23, name:"叶子节点231"},
{ id:232, pId:23, name:"叶子节点232"},
{ id:233, pId:23, name:"叶子节点233"},
{ id:234, pId:23, name:"叶子节点234"},
{ id:3, pId:0, name:"父节点3 - 没有子节点", isParent:true}
];

var json=transformTozTreeFormat(setting,zNodes);
//console.log(JSON.stringify(json));
//alert(JSON.stringify(json));
function resolve(){
document.getElementById("json_div").innerHTML=JSON.stringify(json);
}

</script>


<button onclick="resolve()" >解析</button>
<div id="json_div"></div>

 

算法也照抄zTree里的

http://www.treejs.cn/v3/demo.PHP#_101

© 著作权归作者所有

共有 人打赏支持
粉丝 0
博文 8
码字总数 1681
作品 0
哈尔滨
私信 提问
ztree 生成树时,数据格式的迷惑

@zTree 你好,想跟你请教个问题: 我在开发中遇到一个问题,我的后台返回数据(我是动态生成的,返回的格式是 json),前端接收到的数据显示的格式如下?(我是用 alter(treeNodes)显示出来的...

xu4877
2013/03/20
5.2K
3
Jquery-zTree的基本用法

【简介】 zTree 是利用 JQuery 的核心代码,实现一套能完成大部分常用功能的 Tree 插件 兼容 IE、FireFox、Chrome 等浏览器 在一个页面内可同时生成多个 Tree 实例 支持 JSON 数据 支持一次性...

0o清风徐来o0
2013/03/28
0
0
jquery树形ztree插件根据文件目录路径动态生成树形list的算法

我使用python遍历目录后得到的路径都是一条条的记录,例如: 而ztree的treenode节点数据共有两种形式。 一种是标准json数据格式,标准的 JSON 数据需要嵌套表示节点的父子包含关系: 一种是简...

芝麻糖人
2016/11/27
264
0
easyUI treegird 后台构造数据

真的日了狗了的难忘经历.... 自己根据官网进行遍历获取children节点,勉强能用,后面各种bug... 然后发现...用extJS可以直接根据id、pid生成树。日了狗了!!! 加上extJS,然后后台直接返回...

hello_bear
2015/07/15
0
0
Cisco PT模拟实验(5) 交换机的生成树协议配置

Cisco PT模拟实验(5) 交换机的生成树协议配置 实验目的: 理解生成树协议工作原理 掌握快速生成树协议RSTP的基本配置方法 实验背景: 公司财务部和销售部的PC通过2台交换机实现通信,为提高网...

狄钦dQ
2017/07/22
0
0

没有更多内容

加载失败,请刷新页面

加载更多

分布式锁的实现

redis实现分布式锁 方法1:普通实现方案 实现方式: 使用指令: set key 随机值 ex 5 nx.意思是当key不存在的时候设置key. 如果key存在返回OK,否则返回nil. 实现过程: 1.执行命令set key true ...

grace_233
25分钟前
1
0
解决CKEditor 4 富文本编辑器在图片组件无法显示[上传]选项卡的相关问题

关于解决CKEditor 4 富文本编辑器在图片组件无法显示[上传]选项卡的相关问题。 本文可能会对以下现象得以解决: 图片上传组件,没有 [上传] 选项卡。 资源无法加载 [imgupload] ( Uncaught E...

Eller
28分钟前
0
0
限制php解析、user_agent、php相关配置

11月20日任务 11.28 限定某个目录禁止解析php 11.29 限制user_agent 11.30/11.31 php相关配置 11.28、限定某个目录禁止解析php 核心配置文件内容 <Directory /data/wwwroot/www.123.com/upl...

zgxlinux
33分钟前
1
0
博客园首页新随笔联系订阅管理 随笔

注解Annotation实现原理与自定义注解例子 什么是注解? 对于很多初次接触的开发者来说应该都有这个疑问?Annontation是Java5开始引入的新特征,中文名称叫注解。它提供了一种安全的类似注释的...

onedotdot
50分钟前
4
1
Spring boot + redis 用RedisTemlate实现简单的String key value 操作

springboot集成redis, 简单的key, value缓存操作. 1. application-local.properties # redis on local#spring.redis.port=6379#spring.redis.host=localhost#spring.redis.password=......

园领T
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部