当前位置:首页 > 公司荣誉 >

Web中树形数据(层级关系数据)的实现—以行政区树为例(

作者:厦门七星音乐岛文化传播有限公司 发布时间:2017-09-15 10:28:51

Web中树形数据(层级关系数据)的实现—以行政区树为例(二)

前面已经实现了在Java中生成行政区树(参考博客),其实也可以在JavaScript中生成树,由于JavaScript是弱类型,从某种程度上来说,JavaScript比Java更容易构建树。在JavaScript中只要生成zTree或者Ext Tree支持的数据格式即可。

/** * 构建树,如果传入的参数有多个跟节点,则返回数组,如果只有一个根节点,则返回根节点。 * * @param nodes {Array} 树节点数组,节点格式{id: 1, parentId: null, text: '', children: [], leaf: true} * @return 返回树的根节点 */ function buildTree(nodes){ //如果传入的参数不是数组或者是空数组,则退出 if(Object.prototype.toString.call(nodes) !== '[object Array]' || nodes.length === 0){ return null; } var i, j, child, parent, hasParent, //节点数量 len = nodes.length, //顶级节点数组,如果只有一个顶级节点,该数组只有一个元素,并且该顶级节点是根节点。 tops = []; //如果只有一个节点,则返回该节点 if(len === 1){ reutrn nodes[0]; } //进行两轮遍历,构造树的父节点和子节点 for(i = 0; i < len; i++){ child = nodes[i]; hasParent = false; //如果child没有父节点,则child是顶级节点 if(!child.parentId){ tops.add(child); continue; } for(j = 0; j < len; j++){ parent = nodes[j]; if(parent.id === child.parentId){ //添加子节点 parent.children.push(child); parent.leaf = false; hasParent = true; break; } } //如果child没有父节点,则child是顶级节点 if(!hasParent){ tops.add(child); } } //如果只有一个顶级节点,则返回该节点,否则返回数组。 return tops.length === 1 ? tops[0] : tops; }
通过JavaScript生成树的完整代码如下 //行政区数据 var data = [ {code: 420000, name: 湖北省, parentCode: 0}, {code: 420100, name: 武汉市, parentCode: 420000}, {code: 420101, name: 市辖区, parentCode: 420100}, {code: 420102, name: 江岸区, parentCode: 420100}, {code: 420103, name: 江汉区, parentCode: 420100}, {code: 420104, name: 硚口区, parentCode: 420100}, {code: 420105, name: 汉阳区, parentCode: 420100}, {code: 421000, name: 荆州市, parentCode: 420000}, {code: 421001, name: 市辖区, parentCode: 421000}, {code: 421002, name: 沙市区, parentCode: 421000}, {code: 421003, name: 荆州区, parentCode: 421000}, {code: 430000, name: 湖南省, parentCode: 0}, {code: 430100, name: 长沙市, parentCode: 430000}, {code: 430101, name: 市辖区, parentCode: 430100}, {code: 430102, name: 芙蓉区, parentCode: 430100}, {code: 430103, name: 天心区, parentCode: 430100}, {code: 430104, name: 岳麓区, parentCode: 430100} ]; //把行政区数据转成树节点,以便构建树 var i, nodes = []; for(i = 0; i < data.length; i++){ nodes.push({ id: data[i].code, parentId: data[i].parentCode, text: data[i].name, nodeData: data[i] }); } //创建行政区树 var root = buildTree(nodes);

企业建站2800元起,携手武汉肥猫科技,做一个有见地的颜值派!更多优惠请戳:神农架网站制作 http://shennongjia.666rj.com

  • 上一篇:uva 649 - You Who-(暴力+位运算)
  • 下一篇:最后一页
  • 

    COPYRIGHT © 2015 厦门七星音乐岛文化传播有限公司 ALL RIGHTS RESERVED.

    本站所有原创信息,未经许可请勿任意转载或复制使用

    网站地图 技术支持:肥猫科技
    精彩专题:网站建设
    购买本站友情链接、项目合作请联系客服QQ:2500-38-100