文档章节

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

 开天88
发布于 2016/12/02 08:39
字数 459
阅读 5
收藏 0
点赞 0
评论 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 ⋅ 3

Jquery-zTree的基本用法

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

0o清风徐来o0 ⋅ 2013/03/28 ⋅ 0

zTree简单教程

Jquery-zTree的基本用法 博客分类: Jquery jQueryjsonCSSAjaxChrome 【简介】 zTree 是利用 JQuery 的核心代码,实现一套能完成大部分常用功能的 Tree 插件 兼容 IE、FireFox、Chrome 等浏览...

微笑的江豚 ⋅ 2014/11/19 ⋅ 2

jquery树形ztree插件根据文件目录路径动态生成树形list的算法

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

芝麻糖人 ⋅ 2016/11/27 ⋅ 0

easyUI treegird 后台构造数据

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

hello_bear ⋅ 2015/07/15 ⋅ 0

Cisco PT模拟实验(5) 交换机的生成树协议配置

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

狄钦dQ ⋅ 2017/07/22 ⋅ 0

利用内存多叉树实现Ext JS中的无限级树形菜单(一种构建多级有序树形结构JSON的方法)

利用内存多叉树实现Ext JS中的无限级树形菜单(一种构建多级有序树形结构JSON的方法) 一、问题研究的背景和意义 目前在Web应用程序开发领域,Ext JS框架已经逐渐被广泛使用,它是富客户端开...

星星知我心 ⋅ 2012/01/30 ⋅ 4

利用多叉树实现Ext JS中的无限级树形菜单(一种构建多级有序树形结构JSON的方法)

一、问题研究的背景和意义 目前在Web应用程序开发领域,Ext JS框架已经逐渐被广泛使用,它是富客户端开发中出类拔萃的框架之一。在Ext的UI控件中,树形控件无疑是最为常用的控件之一,它用来...

Alex_曰生 ⋅ 2014/12/01 ⋅ 2

获得Ext.tree.TreePanel中有数据

var tree = new Ext.tree.TreePanel({ ... loader :'url' }) ; var root = new Ext.tree.AsyncTreeNode({ ... }) ; tree.setRootNode(root) ; 通过url请求,数据以json格式返回,并正确生成树......

yujigemu ⋅ 2010/12/23 ⋅ 4

springmvc返回json数据问题

大家好请教一个springmvc controller返回json数据的问题,我现在想用jsTree构建一个树形,jsTree要求返回一个这样格式的json数据: [{ "id":1,"text":"中国","children":[ {"id":2,"text":"...

樱木花道VS康 ⋅ 2017/10/25 ⋅ 8

没有更多内容

加载失败,请刷新页面

加载更多

下一页

NFS介绍 NFS服务端安装配置 NFS配置选项

NFS介绍 NFS是Network File System的缩写;这个文件系统是基于网路层面,通过网络层面实现数据同步 NFS最早由Sun公司开发,分2,3,4三个版本,2和3由Sun起草开发,4.0开始Netapp公司参与并主导...

lyy549745 ⋅ 29分钟前 ⋅ 0

Spring AOP 源码分析 - 筛选合适的通知器

1.简介 从本篇文章开始,我将会对 Spring AOP 部分的源码进行分析。本文是 Spring AOP 源码分析系列文章的第二篇,本文主要分析 Spring AOP 是如何为目标 bean 筛选出合适的通知器(Advisor...

java高级架构牛人 ⋅ 52分钟前 ⋅ 0

HTML-标签手册

标签 描述 <!--...--> 定义注释。 <!DOCTYPE> 定义文档类型。 <a> 定义锚。超链接 <abbr> 定义缩写。 <acronym> 定义只取首字母的缩写。 <address> 定义文档作者或拥有者的联系信息。 <apple......

ZHAO_JH ⋅ 53分钟前 ⋅ 0

SylixOS在t_main中使用硬浮点方法

问题描述 在某些使用场景中,应用程序不使用动态加载的方式执行,而是跟随BSP在 t_main 线程中启动,此时应用代码是跟随 BSP 进行编译的。由于 BSP 默认使用软浮点,所以会导致应用代码中的浮...

zhywxyy ⋅ 今天 ⋅ 0

JsBridge原理分析

看了这个Github代码 https://github.com/lzyzsd/JsBridge,想起N年前比较火的Hybrid方案,想看看现在跨平台调用实现有什么新的实现方式。代码看下来之后发现确实有点独特之处,这里先把核心的...

Kingguary ⋅ 今天 ⋅ 0

Intellij IDEA神器常用技巧五-真正常用快捷键(收藏级)

如果你觉得前面几篇博文太啰嗦,下面是博主多年使用Intellij IDEA真正常用快捷键,建议收藏!!! sout,System.out.println()快捷键 fori,for循环快捷键 psvm,main方法快捷键 Alt+Home,导...

Mkeeper ⋅ 今天 ⋅ 0

Java 静态代码分析工具简要分析与使用

本文首先介绍了静态代码分析的基本概念及主要技术,随后分别介绍了现有 4 种主流 Java 静态代码分析工具 (Checkstyle,FindBugs,PMD,Jtest),最后从功能、特性等方面对它们进行分析和比较,...

Oo若离oO ⋅ 今天 ⋅ 0

SpringBoot自动配置小记

spring-boot项目的特色就在于它的自动配置,自动配置就是开箱即用的本源。 不过支持一个子项目的自动配置,往往比较复杂,无论是sping自己的项目,还是第三方的,都是如此。刚接触会有点乱乱...

大_于 ⋅ 今天 ⋅ 0

React jsx 中写更优雅、直观的条件运算符

在这篇文字中我学到了很多知识,同时结合工作中的一些经验也在思考一些东西。比如条件运算符 Conditional Operator condition ? expr_if_true : expr_if_false 在jsx中书写条件语句我们经常都...

开源中国最帅没有之一 ⋅ 今天 ⋅ 0

vim编辑模式与命令模式

5.5 进入编辑模式 从编辑模式返回一般模式“Esc” 5.6 vim命令模式 命令 :“nohl”=no high light 无高亮,取消内容中高亮标记 "x":保存退出,和wq的区别是,当进入一个文件未进行编辑时,使...

弓正 ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部