js分组递归显示

最新推荐文章于 2022-07-26 21:48:00 发布
最新推荐文章于 2022-07-26 21:48:00 发布
阅读量1k 收藏 2
点赞数
分类专栏： javascript 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  </head>
 <body>
   <div id="divhtml"></div>
  </body>
</html>
<script>


var zNodes=[
  {
    "EvalutionId": 1,
    "AddUser": "leo.zhao",
    "AddType": "Customer Service",
    "Evalation": 1,
    "TaskEvalScore": [
      {
        "TaskScoreId": 1,
        "TaskEvaluationId": 1,
        "Score": 5,
        "ScoreType": 1
      },
      {
        "TaskScoreId": 2,
        "TaskEvaluationId": 1,
        "Score": 5,
        "ScoreType": 2
      },
      {
        "TaskScoreId": 3,
        "TaskEvaluationId": 1,
        "Score": 5,
        "ScoreType": 3
      }
    ],
    "EvaluationContent": [
      {
        "EvalConnId": 1,
        "PrentId": 0,
        "AddUser": "leo.zhao",
        "Content": "不错 很好。。。"
      },
      {
        "EvalConnId": 2,
        "PrentId": 1,
        "AddUser": "leo.zhao",
        "Content": "嗯 我也这么觉得"
      },
      {
        "EvalConnId": 5,
        "PrentId": 2,
        "AddUser": "leo.zhao",
        "Content": "必须顶起 我也是这么任务"
      },
      {
        "EvalConnId": 6,
        "PrentId": 1,
        "AddUser": "leo.zhao",
        "Content": "嗯 我也这么觉得"
      },
      {
        "EvalConnId": 7,
        "PrentId": 0,
        "AddUser": "asdfa",
        "Content": "不错 很好。。。"
      },
      {
        "EvalConnId": 9,
        "PrentId": 7,
        "AddUser": "test",
        "Content": "好你妹啊...我看就不行"
      },
      {
        "EvalConnId": 11,
        "PrentId": 9,
        "AddUser": "test1",
        "Content": "你就一sb"
      },
      {
        "EvalConnId": 13,
        "PrentId": 7,
        "AddUser": "test",
        "Content": "不行 个人意见"
      },
      {
        "EvalConnId": 14,
        "PrentId": 11,
        "AddUser": "test",
        "Content": "喷子 嘴痒痒了啊"
      }
    ]
  },
  {
    "EvalutionId": 2,
    "AddUser": "amy.xu",
    "AddType": "Sales",
    "Evalation": 1,
    "TaskEvalScore": [
      {
        "TaskScoreId": 10,
        "TaskEvaluationId": 2,
        "Score": 5,
        "ScoreType": 1
      },
      {
        "TaskScoreId": 11,
        "TaskEvaluationId": 2,
        "Score": 5,
        "ScoreType": 2
      },
      {
        "TaskScoreId": 12,
        "TaskEvaluationId": 2,
        "Score": 5,
        "ScoreType": 3
      }
    ],
    "EvaluationContent": [
      {
        "EvalConnId": 3,
        "PrentId": 0,
        "AddUser": "leo.zhao",
        "Content": "test111"
      },
      {
        "EvalConnId": 4,
        "PrentId": 3,
        "AddUser": "leo.zhao",
        "Content": "test111"
      }
    ]
  }
]; 


var left = 0;
function treeMenu(a) {
    this.tree = a || [];
    this.groups = {};
};
treeMenu.prototype = {
    init: function (PrentId) {
        this.group();
        return this.getDom(this.groups[PrentId], 0);
    },
    group: function () {
        for (var i = 0; i < this.tree.length; i++) {
            if (this.groups[this.tree[i].PrentId]) {
                this.groups[this.tree[i].PrentId].push(this.tree[i]);
            } else {
                this.groups[this.tree[i].PrentId] = [];
                this.groups[this.tree[i].PrentId].push(this.tree[i]);
            }
        }
    },
    getDom: function (a, j) {
        if (!a) { return '' }
        var html = "";
        left = j == 1 ? left + 2 : left;
        for (var i = 0; i < a.length; i++) {
            html += '<ul>';
            html += '<li    style="padding-left:' + left + 'em"><span><q>' + a[i].Content + '</q></span></li>';
            html += this.getDom(this.groups[a[i].EvalConnId], 1);
            html += '</ul>';
        }
        left = 0
        return html;
    }
};

var html="";
for(var i =0;i<zNodes.length;i++)
{
	html+=new treeMenu(zNodes[i].EvaluationContent).init(0);
}
document.getElementById("divhtml").innerHTML=html;
 </script>

个人觉得挺实用  记录一下 留着以后再用

zhaochanglong
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js实现分组随机显示程序
12-19
这是一个通过用js实现输入起始和结束号码实现分组的小程序
递归分组
weixin_45754140的博客
12-10 342
从1到10分成两组 #include<iostream> #include<cstring> #include<cmath> using namespace std; int s[10] = { 1,2,3,4,5,6,7,8,9 ,10}; int s1[10]; int s2[10]; int index1; int index2; int ans = 0; void divide(int index) { if (index == 10) { for (in
JS使用递归实现无限分类
xiaodouxuan11的博客
09-30 784
后台返回的数据格式 const data = [ { "id": 1, "name": "标题1", "pid": 0 }, { "id": 2, "name": "标题2", "pid": 0 }, { "id": 3, "name":
SQL SERVER 递归查询（3）——分组递归
二月十六的博客
03-17 1万+
      有时候我们需要按照分组递归查询，比如省市区，同一个省同一个市的要放到一起显示，而我们原始数据又不是这样排列的，所以需要我们做一下处理，测试数据：--测试数据 if not object_id(N'Tempdb..#T') is null drop table #T Go Create table #T([Id] int,[Name] nvarchar(24),[FatherId] i...
递归练习1，数字分组
weixin_30580943的博客
08-03 120
Q:将数字 sum 分为 k组，5分成3组，"0 0 5" ，"0 1 4" ，0 2 3 ...，2 1 2. /// <summary> /// 将数字 sum 分为 k组，5分成3组，"0 0 5" ，"0 1 4" ，0 2 3 ...，2 1 2. /// </summary> /// <param name="sum"&gt...
JS动态树分组的实现，数据库建表，JSP页面展示
11-08
本项目主要涉及JavaScript（JS）实现动态树分组、数据库建表以及JSP页面的展示。以下将详细阐述这些知识点。 **JavaScript动态树分组** JavaScript动态树分组是指在网页前端利用JavaScript库，如jQuery、React或Vue...
Vue两种组件类型:递归组件和动态组件的用法
10-14
2. **动态绑定`is`**：在`parentComponent.vue`的示例中，`<component :is="currentView"></component>`根据`currentView`的值来决定显示哪个组件。`changeToViewB`方法负责切换`currentView`的值，从而实现组件的...
正则表达式、分组、子匹配（子模式）、非捕获子匹配（子模式）
12-13
这个时候，我们需要分组了。就是用小括号来括起这些字符，指定子表达式(也叫做分组)。然后你就可以指定这个子表达式的重复次数了，你也可以对子表达式进行其它一些操作。这个时候，可以把括号中一组字符，看作一个...
好看的树样式tree
08-18
用户点击节点时，JavaScript会修改节点的状态（例如，添加或删除一个“展开”类），同时更新DOM以显示或隐藏子节点。 2. **js分组列表**： 分组列表是指将数据按照特定的类别或属性进行分组，每组数据作为一个树...
纯js多重嵌套tab切换效果.zip
07-05
在网页设计中，JavaScript（简称JS）是一种广泛使用的客户端脚本语言，用于增强用户的交互体验。这个"纯js多重嵌套tab切换效果"项目显然旨在教你如何使用纯JavaScript实现一个功能丰富的多层嵌套Tab切换效果，而无需...
图片展示-分组相册jquery图片特效.rar
07-10
jquery实现的图片特效，类似于图片展示，一个支持分类的分组相册，点击分类可查看所属分类下的缩略图，点击缩略图则显示出该图对应的大图片，分组切换时带动画效果。
遍历json显示树形菜单
10-18
遍历json显示树形菜单 遍历json显示树形菜单 遍历json显示树形菜单
JS列表数据通过递归实现树形结构
cs1330的博客
07-26 531
递归实现列表数据转树形数据
java 递归分组_在Java中递归列出文件
weixin_39836898的博客
02-27 198
/准备运行importjava.io.File;publicclassFilewalker{publicvoidwalk(Stringpath){Fileroot=newFile(path);File[]list=root.listFiles();if(list==null)return;for(Filef:list){if(f.is...
javascript递归详解
grbrb的博客
07-01 674
javascript递归详解 计算机科学的新学生通常难以理解递归程序设计的概念。递归思想之所以困难，原因在于它非常像是循环推理（circular reasoning）。它也不是一个直观的过程；当我们指挥别人做事的时候，我们极少会递归地指挥他们。 对刚开始接触计算机编程的人而言，这里有递归的一个简单定义：当函数直接或者间接调用自己时，则发生了递归。 递归的经典示例 计算阶乘是递归程序设计的一个经典示例。计算某个数的阶乘就是用那个数去乘包括 1 在内的所有比它小的数。例如，factorial(5) 等价于 54
使用 JavaScript 进行数据分组最优雅的方式
zybb166的博客
12-27 887
对数据进行分组，是我们在开发中经常会遇到的需求，使用JavaScript进行数据分组的方式也有很多种，但是由于没有原生方法的支持，我们自己实现的数据分组函数通常都比较冗长而且难以理解。 不过，告诉大家一个好消息，一个专门用来做数据分组的提案Array.prototype.groupBy已经到达Stage 3啦！ 在看这个提案，之前，我们先来回顾下我们以前在 JavaScript 里是怎么分组的。 以前的方式 假设我们有下面一组数据： const items = [ { ...
前端框架 关于树形菜单的递归方法
beyond丿灬的博客
09-24 918
/** * 查询后台需要属性展示的菜单表数据 注意：该数据转换成json对象， 是不符合easyUI的tree主键展现的json格式 * * @param map * @param pageBean * @return * @throws Exception */ public List<Map<String, Object>> menuL...
js 递归 实现无限层级的树形结构 设置层级
IT民工阿铁的博客
05-18 3940
https://gitee.com/ntla123/itree
JS递归遍历树结构
热门推荐
S1ow
08-15 5万+
<script> var arrs = []; function haha(){ var data = [ { name: '中国, children: [ { name: '教',
linux 递归显示目录文件
最新发布
04-10
Linux递归显示目录文件是什么意思？ 回答：Linux递归显示目录文件是指，显示指定目录下包括其子目录中的所有文件和文件夹，直到全部遍历完毕。这样可以方便查看文件和文件夹的结构，并快速定位需要的内容。常用的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值