Js nested objects have been subset id, how to find all the id? of the parent

clipboard.png
requires the effect. When any checkbox is clicked, all the parents are automatically selected. The parents and subsets are separate and not fully selected. The code structure is as follows

[
        {
            "id": 1,
            "display_name": "",
            "children": []
        },
        {
            "id": 2,
            "display_name": "",
            "children": [
                {
                    "id": 3,
                    "display_name": "",
                    "children": [
                        {
                            "id": 5,
                            "display_name": ""
                        },
                        {
                            "id": 6,
                            "display_name": ""
                        },
                        {
                            "id": 7,
                            "display_name": "/"
                        },
                        {
                            "id": 8,
                            "display_name": ""
                        }
                    ]
                },
                
Mar.12,2021

if the number of layers is determined, you can do this:

<script>
    var ad = [
        {
            "id": 1,
            "display_name": "",
            "children": []
        },
        {
            "id": 2,
            "display_name": "",
            "children": [
                {
                    "id": 3,
                    "display_name": "",
                    "children": [
                        {
                            "id": 5,
                            "display_name": ""
                        },
                        {
                            "id": 6,
                            "display_name": ""
                        },
                        {
                            "id": 7,
                            "display_name": "/"
                        },
                        {
                            "id": 8,
                            "display_name": ""
                        }
                    ]
                }
            ]
        }];

    var the_id = 5;
    var the_select_id = [];

    for(var i in ad){
        if (ad[i].id !== the_id) {
            for(var j in ad[i].children) {

                if (ad[i].children[j].id !== the_id) {
                    for(var k in ad[i].children[j].children) {

                        if (ad[i].children[j].children[k].id == the_id) {
                            the_select_id.push(ad[i].children[j].children[k].id);
                            the_select_id.push(ad[i].children[j].id);
                            the_select_id.push(ad[i].id);
                        }
                    }
                } else {
                    the_select_id.push(ad[i].children[j].id);
                    the_select_id.push(ad[i].id);
                }
            }
        } else {
            the_select_id.push(ad[i].id);
        }
    }

    console.log(the_select_id);
</script>

effect is shown in figure

clipboard.png

of course, the code can also be streamlined and optimized, which is just a reference

.
Menu