首页 > 编程知识 正文

前端处理树形结构数据,前端遍历树结构

时间:2023-05-06 11:47:20 阅读:205445 作者:1289

简单树形结构数据处理 <script type="text/javascript"> // 1. 准备数据: 系统->我的面板,内容管理->(个人信息,文件管理)(统计分析) var nodes = [ { 'id':'1', 'name':'系统', 'pid' : '0' }, { 'id':'2', 'name':'我的面板', 'pid' : '1' }, { 'id':'3', 'name':'内容管理', 'pid' : '1' }, { 'id':'4', 'name':'个人信息', 'pid' : '2' }, { 'id':'5', 'name':'文件管理', 'pid' : '2' }, { 'id' : '6', 'name' : '统计分析', 'pid' : '3' } ]; var tree = new Node(0, null); // 首先准备一个数的头 // 处理数据,整理成树,这里适应的环境是必须要父节点排在前面(无法保证这个情况的话,可以采用循环排除的方式处理;或者其他方法处理) for (var i = 0;i < nodes.length; i++) { // 1. 查询父节点 var node = tree.find(nodes[i].pid); if (typeof(node) == undefined) { continue; } node.append(new Node(nodes[i].id,nodes[i])); } console.log(tree); // 树结点 function Node(id,data) { this.id = id; this.data = data; this.parent = null; this.children = []; this.find = function (id) { // 这里使用递归的方式进行id这个结点的查找 if (id == this.id) return this; for (var i = 0;i < this.children.length; i++) { var node = this.children[i].find(id); if (node != null) return node; } } this.append = function (node) { this.children.push(node); // 向父结点中添加子节点 node.parent = this; // 设置子结点的父亲 } }</script>

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。