簡體   English   中英

在javascript / jquery中解析多層嵌套json

[英]Parsing multi-level nested json in javascript/jquery

這是我正在使用的json,

{
    "location": [
        {
            "location_name": "Delhi",
            "latitude": "19.07598",
            "longitude": "72.87766",
            "location_id": 1,
            "center": [
                {
                    "center_name": "Center 1",
                    "cc_id": "1",
                    "date": "10/10/2014",
                    "dept": [
                        {
                            "id": 1,
                            "name": "Accounting",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "95%"
                                },
                                {
                                    "vital_name": "Avg. Overtime%",
                                    "vital_val": "1.2"
                                }
                            ]
                        },
                        {
                            "id": 2,
                            "name": "HR",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "97%"
                                },
                                {
                                    "vital_name": "Total Interns",
                                    "vital_val": "25%"
                                }
                            ]
                        }
                    ]
                },
                {
                    "center_name": "Center 2",
                    "cc_id": "2",
                    "date": "10/10/2014",
                    "dept": [
                        {
                            "id": 1,
                            "name": "IT",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "99%"
                                },
                                {
                                    "vital_name": "Avg. Overtime",
                                    "vital_val": "1.5"
                                }
                            ]
                        }
                    ]
                }
            ]
        },
        {
            "location_name": "Bangalore",
            "latitude": "12.97160",
            "longitude": "77.87766",
            "location_id": 2,
            "center": [
                {
                    "center_name": "Center 3",
                    "cc_id": "3",
                    "date": "12/12/2014",
                    "dept": [
                        {
                            "id": 1,
                            "name": "Customer Support",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "98%"
                                },
                                {
                                    "vital_name": "Fresh Hires",
                                    "vital_val": "35%"
                                }
                            ]
                        }
                    ]
                }
            ]
        }
    ]
}

我需要的是在給定位置下獲取所有部門的所有生命力。 因此,如果給定的位置是德里,我需要按部門分組的生命數據。 並按中心進一步分組。 這是我的代碼,

   for (i in obj.location) {
        var data_node = obj.location[i];
        if (data_node.location_id == locId) {
          var centers = data_node.center;
          for (c in centers){
           var cc = centers[c];
             var dept_node = cc.dept;   
             var dept = dept_node;
             for (j in dept) {
                var vit = dept[j];
                for (k in vit.vitals) {

                }
            }
          }
        }
    }

但是我認為我沒有走對,因為它沒有用。 我究竟做錯了什么?

我正在嘗試從數據中制作一個像這樣的表, 在此處輸入圖片說明

您可以使用filterreducemap

 var a = { "location": [ { "location_name": "Delhi", "latitude": "19.07598", "longitude": "72.87766", "location_id": 1, "center": [ { "center_name": "Center 1", "cc_id": "1", "date": "10/10/2014", "dept": [ { "id": 1, "name": "Accounting", "vitals": [ { "vital_name": "Attendance", "vital_val": "95%" }, { "vital_name": "Avg. Overtime%", "vital_val": "1.2" } ] }, { "id": 2, "name": "HR", "vitals": [ { "vital_name": "Attendance", "vital_val": "97%" }, { "vital_name": "Total Interns", "vital_val": "25%" } ] } ] }, { "center_name": "Center 2", "cc_id": "2", "date": "10/10/2014", "dept": [ { "id": 1, "name": "IT", "vitals": [ { "vital_name": "Attendance", "vital_val": "99%" }, { "vital_name": "Avg. Overtime", "vital_val": "1.5" } ] } ] } ] }, { "location_name": "Bangalore", "latitude": "12.97160", "longitude": "77.87766", "location_id": 2, "center": [ { "center_name": "Center 3", "cc_id": "3", "date": "12/12/2014", "dept": [ { "id": 1, "name": "Customer Support", "vitals": [ { "vital_name": "Attendance", "vital_val": "98%" }, { "vital_name": "Fresh Hires", "vital_val": "35%" } ] } ] } ] } ] } var result = a.location.filter(function(item) { return item.location_name === "Delhi"; }) .reduce(function(element) { return element; }) .center.map(function(element) { return element.dept; }).reduce(function(element) { return element }).map(function(element){ return element.vitals; }); console.log(result) $("body").append(JSON.stringify(result)) 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <body></body> 

我做了一個小程序,輸出您顯示的表。

$(document).ready(function() {
    var table = {title : "", columns : []};

    // Create table columns
    for (i in obj.location) {
        var data_node = obj.location[i];
        if (data_node.location_id == 1) {
            var centers = data_node.center;
            table.title = data_node.location_name;
            for (c in centers){
                var new_column = [];
                var cc = centers[c];
                var dept_node = cc.dept;   
                var dept = dept_node;

                new_column.push("(center_name) " + cc.center_name);
                new_column.push("(date) " + cc.date);
                for (j in dept) {
                    new_column.push("(dept -) " + dept[j].name)
                    var vit = dept[j];
                    for (k in vit.vitals) {
                        new_column.push("(vital)" + vit.vitals[k].vital_name + "& (vital_value) " + vit.vitals[k].vital_value);
                    }
                    new_column.push("");
                }
                table.columns.push(new_column);
            }
        }
    }

    // Make sure are columns are of the same length, else rendering will not work
    var maxElements = 0;
    table.columns.forEach(function(column) {
        if (column.length > maxElements)
            maxElements = column.length;
    });

    table.columns.forEach(function(column) {
        while (column.length < maxElements) {
            column.push("");
        }
    });


    // Render all columns
    $("table tbody").append("<tr><td colspan='100'>(location_title) " + table.title + "</td></tr>");
    for (var i = 0; i < maxElements; ++i) {
        var row_cells = [];
        table.columns.forEach(function(column) {
            row_cells.push(column[i]);
        })
        console.log("<td>" + row_cells.join("</td><td>") + "</td>");
        $("table tbody").append("<tr><td>" + row_cells.join("</td><td>") + "</td></tr>");
    }
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM