js 递归获取多层树的某个节点

两种方法,废话不多说,直接上代码。

第一种,函数里套函数用法

var data = [
        {
            text: 'Item1',
            iconCls: 'icon-more',
            id:1,
            children: [
                {
                    text: 'option1',
                    url: '/datalist.html?id=1',
                    id: 2
                },
                {
                    text: 'option2',
                    url: '/datalist.html?id=2',
                    id: 3
                },
                {
                    text: 'option3',
                    url: '/datalist.html?id=3',
                    id: 4
                },
            ]
        },
        {
            text: 'Item2',
            iconCls: 'icon-more',
            id:5,
            children: [
                {
                    text: 'option4',
                    url: '/datalist.html?id=4',
                    id: 6
                },
                {
                    text: 'option5',
                    url: '/datalist.html?id=5',
                    id: 7
                },
                {
                    text: 'option6',
                    url: '/datalist.html?id=6',
                    id: 8
                },
            ]
        },
        {
            text: 'Item3',
            iconCls: 'icon-more',
            id:9,
            children: [
                {
                    text: 'option7',
                    url: '/datalist.html?id=7',
                    id: 10
                },
                {
                    text: 'option8',
                    url: '/datalist.html?id=8',
                    id: 11
                },
                {
                    text: 'option9',
                    url: '/datalist.html?id=9',
                    id: 12
                },
            ]
        },
        {
            text: 'Item4',
            iconCls: 'icon-more',
            id:13,
            children: [
                {
                    text: 'option10',
                    url: '/datalist.html?id=10',
                    id: 13
                },
                {
                    text: 'option11',
                    url: '/datalist.html?id=11',
                    id: 14
                },
                {
                    text: 'option12',
                    url: '/datalist.html?id=12',
                    id: 15
                },
            ]
        },
        {
            text: 'Item5',
            iconCls: 'icon-more',
            id:16,
            children: [
                {
                    text: 'option13',
                    url: '/datalist.html?id=13',
                    id: 17
                },
                {
                    text: 'option14',
                    url: '/datalist.html?id=14',
                    id: 18
                },
                {
                    text: 'option15',
                    url: '/datalist.html?id=15',
                    id: 19
                },
            ]
        },
        {
            text: 'Item6',
            iconCls: 'icon-more',
            id:20,
            children: [
                {
                    text: 'option16',
                    url: '/datalist.html?id=16',
                    id: 21
                },
                {
                    text: 'option17',
                    url: '/datalist.html?id=17',
                    id: 22
                },
                {
                    text: 'option18',
                    url: '/datalist.html?id=18',
                    id: 23
                },
                {
                    text: 'option19',
                    url: '/datalist.html?id=19',
                    id: 24
                },
                {
                    text: 'option20',
                    url: '/datalist.html?id=20',
                    id: 25
                },
                {
                    text: 'option21',
                    url: '/datalist.html?id=21',
                    id: 26
                },
            ]
        },
    ];
var hash = '/datalist.html?id=21';
var current = getTarget(hash,data)
    console.log(current)
function getTarget(target,data){
    var obj = {};
    function each(target,data){
        for(var i = 0; i < data.length; i++){
            if(data[i].url == target){
                obj = data[i]
            }else if(('children' in data[i]) && data[i].children.length > 0){
                each(target,data[i].children)
            }
        }
    }
    each(target,data)
    return obj;
}

第二种方法,使用callback

var data = [
        {
            text: 'Item1',
            iconCls: 'icon-more',
            id:1,
            children: [
                {
                    text: 'option1',
                    url: '/datalist.html?id=1',
                    id: 2
                },
                {
                    text: 'option2',
                    url: '/datalist.html?id=2',
                    id: 3
                },
                {
                    text: 'option3',
                    url: '/datalist.html?id=3',
                    id: 4
                },
            ]
        },
        {
            text: 'Item2',
            iconCls: 'icon-more',
            id:5,
            children: [
                {
                    text: 'option4',
                    url: '/datalist.html?id=4',
                    id: 6
                },
                {
                    text: 'option5',
                    url: '/datalist.html?id=5',
                    id: 7
                },
                {
                    text: 'option6',
                    url: '/datalist.html?id=6',
                    id: 8
                },
            ]
        },
        {
            text: 'Item3',
            iconCls: 'icon-more',
            id:9,
            children: [
                {
                    text: 'option7',
                    url: '/datalist.html?id=7',
                    id: 10
                },
                {
                    text: 'option8',
                    url: '/datalist.html?id=8',
                    id: 11
                },
                {
                    text: 'option9',
                    url: '/datalist.html?id=9',
                    id: 12
                },
            ]
        },
        {
            text: 'Item4',
            iconCls: 'icon-more',
            id:13,
            children: [
                {
                    text: 'option10',
                    url: '/datalist.html?id=10',
                    id: 13
                },
                {
                    text: 'option11',
                    url: '/datalist.html?id=11',
                    id: 14
                },
                {
                    text: 'option12',
                    url: '/datalist.html?id=12',
                    id: 15
                },
            ]
        },
        {
            text: 'Item5',
            iconCls: 'icon-more',
            id:16,
            children: [
                {
                    text: 'option13',
                    url: '/datalist.html?id=13',
                    id: 17
                },
                {
                    text: 'option14',
                    url: '/datalist.html?id=14',
                    id: 18
                },
                {
                    text: 'option15',
                    url: '/datalist.html?id=15',
                    id: 19
                },
            ]
        },
        {
            text: 'Item6',
            iconCls: 'icon-more',
            id:20,
            children: [
                {
                    text: 'option16',
                    url: '/datalist.html?id=16',
                    id: 21
                },
                {
                    text: 'option17',
                    url: '/datalist.html?id=17',
                    id: 22
                },
                {
                    text: 'option18',
                    url: '/datalist.html?id=18',
                    id: 23
                },
                {
                    text: 'option19',
                    url: '/datalist.html?id=19',
                    id: 24
                },
                {
                    text: 'option20',
                    url: '/datalist.html?id=20',
                    id: 25
                },
                {
                    text: 'option21',
                    url: '/datalist.html?id=21',
                    id: 26
                },
            ]
        },
    ];
var hash = '/datalist.html?id=21';
var target = {};
getTarget(hash,data,(res)=>{
    target = res
})
console.log(target)
function getTarget(target,data,callback){
    for(var i = 0; i < data.length;i++){
        if(data[i].url == target){
            return callback(data[i])
        }else if(('children' in data[i]) && data[i].children.length > 0){
            getTarget(target,data[i].children,callback)
        }
    }
}

  应该能够看懂吧

原文地址:https://www.cnblogs.com/dayin1/p/14714623.html