js 递归树结构数据查找父级
1.json树数据查找所有父级--完成
json:树结构数据
var arrData = [{
"label": "中国",
"City": null,
"value": "",
"children": [{
"label": "河北",
"City": "",
"value": "",
"children": [{
"label": "石家庄",
"City": "",
"value": "1.1",
"children": null
},
{
"label": "保定",
"City": "",
"value": "1.2",
"children": null
},
{
"label": "邯郸",
"City": "",
"value": "1.3",
"children": [{
"label": "邯山区",
"City": "1.3",
"value": "1.3.1",
"children": [{
"label": "丛西街道",
"City": "1.3.1",
"value": "1.3.1.1",
"children": null
}]
},
{
"label": "涉县",
"City": "1.3",
"value": "1.3.2",
"children": null
},
{
"label": "丛台区",
"City": "1.3",
"value": "1.3.3",
"children": null
}
]
}
]
},
{
"label": "山东",
"City": "",
"value": "",
"children": [{
"label": "济南",
"City": "",
"value": "2.1",
"children": null
}]
},
{
"label": "北京",
"City": "",
"value": "",
"children": null
}
]
}];
递归查找父级数据
// data:json nodeId:节点,arrRes:[] 返回的数据
function getParentNode(data, nodeId, arrRes) {
if (!data ) {
if (!nodeId) {
arrRes.unshift(nodeId);
}
return arrRes;
}
for (var i = , length = data.length; i < length; i++) {
let node = data[i];
if (node.value == nodeId) {
arrRes.unshift(nodeId);
console.log(arrData);
getParentNode(arrData, node.City, arrRes);
break;
}
else {
if (!!node.children) {
getParentNode(node.children, nodeId, arrRes);
}
} }
return arrRes;
};
调用: var res = getParentNode(arrData, '1.3.1', []);
2.再次修改后:
// data:json, nodeId:节点
function getParent(data2, nodeId2) {
var arrRes = [];
if (data2.length == ) {
if (!!nodeId2) {
arrRes.unshift(nodeId2);
}
return arrRes;
}
let rev = (data, nodeId) => {
for (var i = , length = data.length; i < length; i++) {
let node = data[i];
if (node.value == nodeId) {
arrRes.unshift(nodeId);
rev(data2, node.City);
break;
}
else {
if (!!node.children) {
rev(node.children, nodeId);
}
}
}
return arrRes;
};
arrRes = rev(data2, nodeId2);
return arrRes;
}
调用:var res = getParent(arrData, '1.3.1');
3. 正则表达式 查找的,递归20级深度的;
var getValue=(function () {
var arrData = [{
"label": "中国",
"City": null,
"value": "",
"children": [{
"label": "河北",
"City": "",
"value": "hb",
"children": [{
"label": "石家庄",
"City": "",
"value": "1.1",
"children": null
},
{
"label": "保定",
"City": "",
"value": "1.2",
"children": null
},
{
"label": "邯郸",
"City": "n",
"value": "bk",
"children": [{
"label": "邯山区",
"City": "bk",
"value": "1.3.1",
"children": [{
"label": "丛西街道",
"City": "1.3.1",
"value": "1.3.1.1",
"children": null
}]
},
{
"label": "涉县",
"City": "1.3",
"value": "1.3.2",
"children": null
},
{
"label": "丛台区",
"City": "1.3",
"value": "1.3.3",
"children": null
}
]
}
]
},
{
"label": "山东",
"City": "",
"value": "",
"children": [{
"label": "济南",
"City": "",
"value": "2.1",
"children": null
}]
},
{
"label": "北京",
"City": "",
"value": "",
"children": null
}
]
}];
console.log(JSON.stringify(arrData[]))
return function getValue(values){
var arrs=[];
var values=values;
var c=JSON.stringify(arrData[]);
var keys='';
if(arguments[]&&c.search(values)!=-){
for(var i=;i<;i++){
var newReg=new RegExp('\"City\"\:\"([^\"]+)\"\,\"value\"\:\"'+values);
if(values!=keys){
arrs.unshift(values)
}
if(c.search(newReg)!=-){
keys=c.match(newReg)[].replace(newReg,'$1')
arrs.unshift(keys);
values=keys;
}else{
arrs.unshift(null)
return arrs;
}
}}else{
return values
}
}
})();
console.log(getValue('1.3.1'))
4.Cascader 级联选择 组件 v-model的数据是一个数组类型,工作中如果需要回显的话,就需要传递所有父级元素的ID所组成的数组,但是后台只存放了目标元素的ID,所以只能自己去遍历数据获取了
用递归查找到ID的所属元素,然后把每一级的parentId一起返回。
转:https://blog.csdn.net/weixin_42869548/article/details/82012316
[{
"orgId": ,
"orgName": "校长办公室1",
"parentId": ,
"children": [{
"orgId": ,
"orgName": "校长办公室2",
"parentId": ,
"children": [{
"orgId": ,
"orgName": "校长办公室3",
"parentId": ,
}]
}]
}]
function buildParentList(arr){
arr.forEach(g =>
{
if(g.parentId != undefined) {
let pid = g['parentId']
let oid = g['orgId']
parentList[oid] = pid
}
if (g.children != undefined)
buildParentList(g['children'])
})
}
function findParent(idx){
if (parentList[idx] != undefined){
let pid = parentList[idx]
console.log(pid)
findParent(pid)
}
}
buildParentList(list)
findParent(); // 0 1 2
findParent(); // 0 1
findParent(); // undefined
5.从上往下找下的
function getParents(data, id) {
for (var i in data) {
if (data[i].value == id) {
return [];
}
if (data[i].children) {
var ro = getParents(data[i].children, value);
if (ro !== undefined)
return ro.concat(data[i].id);
}
}
console.log(ro);
}
js 递归树结构数据查找父级的更多相关文章
- Sqlserver如何递归查询层级数据将父级字段和本级某个字段合并?如何自定义用户函数并调用?
开门见山,首先说下遇到的问题:前期系统地区字典表中,每个省市县只存了本级名称,没存完整的字段.如:肥西县隶属安徽省合肥市,表中就存了一个肥西县.现有需求需要将完整字段显示,由于系统已在线上运营,无法做 ...
- JS - 点击事件排除父级标签
点击事件排除父级标签,这里使用的是stopPropagation()方法.event.stopPropagation(); 对了,这里还用了解除click事件,unbind. 下面这篇博文,介绍挺全的 ...
- JS-对象查找父级
之前在寻找两个以上的父级,一直傻傻的用parent().parent()... 今天,需要写五个,当然以前也是写过五个的,但是今天总想着换个简单的方式,至少不要.parent().parent().p ...
- js动态绑定class(当前父级div下的子元素有没有这个class,有的话移除,没有的话添加)
<div class="layui-inline" id=‘’ onclick="changeType(id)"> ...
- php中递归查找父级名称
/** * 获取所属公司 * @param array 列表 * @param $id 上级ID * @return array */ private static function get_top_ ...
- JS获取节点的兄弟,父级,子级元素的方法(js获取子级获取到换行与空格元素-FF)
先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比. JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当最DOM元素 < ...
- js或jquery如何获取父级、子级、兄弟元素(包括祖级、孙级等)
原生javascript方法: var a = document.getElementById("dom"); del_space(a); //清理空格 var b = a.chi ...
- dom node 查找父级parentNode
var o = document.querySelectorAll("a[href='baidu.com']"); var p = o[o.length-1];console.lo ...
- js根据子目录数目显示父级目录
需求:<ul>中<li>数量为0,则不显示<ul>以及<b>:<div>中<ul>数量为0,则不显示<div> 1. ...
随机推荐
- springboot pom 详解
Starter POMs是可以包含到应用中的一个方便的依赖关系描述符集合.可以获取所有spring及相关技术的一站式服务,不需要翻阅示例代码,拷贝粘贴大量的依赖描述符. Starter名字的含义: 所 ...
- HDU6400-2018ACM暑假多校联合训练1004-Parentheses Matrix-构造
Parentheses Matrix Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Oth ...
- [Swift实际操作]八、实用进阶-(6)通过属性进行对象间的消息传递
本文将演示,如何通过一个对象作为另一个对象的属性,从而通过设置属性的值,来实现对象之间的消息传递.首先打开自定义视图的代码文件(CustomView.swift) import UIKit //使当前 ...
- java里面的标识符、关键字和类型
1. 注释 Java中有三种注释: (1) // -单行注释,注释从“//”开始,终止于行尾: (2) -多行注释,注释从““结束: (3) -是Java特有的doc注释,这种注释主 ...
- String,数组,list集合长度的使用
public class Use{ public static void main(String[] args){ int[] arr=new int[]{19,10,20,30,23,13}; // ...
- Kettle 行列互换之——行转列(多列数据合并成一列变为多行)
原始需求如下: 业务系统设置成这样,见截图. 工资项目为了方便录入,都是做成列的. 但是这些数据需要和另外的费用报销系统的数据关联,费用报销系统的费用项目是横向的,用费用项目.金额的多行来表达.那么这 ...
- 【sql server】"已更新或删除的行值要么不能使该行成为唯一行,要么改变了多个行" 解决方案
#事故现场: 1.在手动修改某表中数据是,出现如下错误提示: 已更新或删除的行值要么不能使该行成为唯一行,要么改变了多个行 2.表结构及数据: #解决方法: 1.原因分析:提示被删除的行不是唯一行, ...
- v-model和v-bind的区别
VUE学习篇1 Mustache (双大括号写法)不能在 HTML 属性中使用,应使用 v-bind 指令: <div v-bind:id="dynamicId">&l ...
- [蓝桥杯][2015年第六届真题]机器人塔(dfs)
题目描述 X星球的机器人表演拉拉队有两种服装,A和B. 他们这次表演的是搭机器人塔. 类似: A B B A B A A A B B B B B A B A B A B ...
- SQL的CharIndex用法
和C#一样判断一个字符串中是否包含另一个字符串举例1:select charindex('test','This Test is test!!')->返回 6 (空格也算一个 下标从1开始)2: ...