使用jquery访问嵌套JSON数组中的数据

Question

由于某些原因，我在访问以下嵌套数组的特定值时遇到了问题：

[{
    "call_sign": "KTAB-TV",
    "facility_id": "59988",
    "operator": "Nexstar Media Group Inc",
    "programming_class": [{
        "primary": {
            "programming": "CBS",
            "resolution": "1080i",
            "resolution_type": "HD",
            "programming_classifier": "HD1"
        },
        "d_2": {
            "programming": "Telemundo",
            "resolution": "480i",
            "resolution_type": "SD",
            "programming_classifier": "SD1"
        },
        "d_3": {
            "programming": "Escape",
            "resolution": "480i",
            "resolution_type": "SD",
            "programming_classifier": "SD2"
        },
        "d_4": {
            "programming": "ION",
            "resolution": "480i",
            "resolution_type": "SD",
            "programming_classifier": "SD3"
        },
        "d_5": {
            "programming": "None",
            "resolution": "NULL",
            "resolution_type": "N\/A",
            "programming_classifier": "None"
        },
        "d-6": {
            "programming": "None",
            "resolution": "NULL",
            "resolution_type": "N\/A",
            "programming_classifier": "None"
        }
    }]
}]

现在，我最好的猜测是：

$.ajax({
    method: "POST",
    url: "prep_station_data.php?sid=" + sid,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data) {
        console.log('success');
        for (key in data) {
            var value = data[key];
            console.log(value);
        }
        $.getJSON(jsonURL, function(key, value) {
            var resolutions = '';
            $.each(data[0].programming_class, function(key, value) {
                resolutions += value.resolution;

            });
            $('#primary_programming').append(resolutions);
        });
    },
    complete: function() {}
});
}

不幸的是，我仍然得到一个“未定义”的结果。

此外，如果json数据数组中的programming_classifier键是特定值，我想了解如何在jquery中创建一条if语句来填充div。

感谢你的帮助，因为我被卡住了。

Answer 1

programming_class也是一个只有一个元素的数组。所以..。

data[0].programming_class[0]

这是一个有效的数据处理函数。

​

$(function() {

    var json = '[{"call_sign":"KTAB-TV","facility_id":"59988","operator":"Nexstar Media Group Inc","programming_class":[{"primary":{"programming":"CBS","resolution":"1080i","resolution_type":"HD","programming_classifier":"HD1"},"d_2":{"programming":"Telemundo","resolution":"480i","resolution_type":"SD","programming_classifier":"SD1"},"d_3":{"programming":"Escape","resolution":"480i","resolution_type":"SD","programming_classifier":"SD2"},"d_4":{"programming":"ION","resolution":"480i","resolution_type":"SD","programming_classifier":"SD3"},"d_5":{"programming":"None","resolution":"NULL","resolution_type":"N/A","programming_classifier":"None"},"d-6":{"programming":"None","resolution":"NULL","resolution_type":"N/A","programming_classifier":"None"}}]}]';

    function handleData(data) {
        var pc = data[0]['programming_class'][0];
        var ret = [];
        for (var i in pc) {
            if (pc.hasOwnProperty(i)) {
                for (var j in pc[i]) {
                    if (pc[i].hasOwnProperty(j)) {
                        if (j == 'resolution') {
                            ret.push(pc[i][j]);
                        }
                    }
                }
            }
        }
        return ret;
    }

    var stuff = handleData(JSON.parse(json));

    $('#content').text(stuff.join(', '));

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="content"></div>

​

Answer 2

首先: getJSON的回调不会返回(key, value)，它会返回(parseArray, successString) =>，所以你的循环不会运行。检查下面，一个可能的解决方案可以是：

​

$.getJSON("https://api.jsonbin.io/b/5c7e2d275fe214587796753b", (data) => {
  
  // $.getJSON callback format returns  (data, status)
  // so if you get it as (key, value) you will get (Your JSON Array, "success") 
  // Solution is below
  
  data.forEach((value, key) => {
      if(value.programming_class){
          // programming class is an array in provided JSON
          // you can use static first index as well if it is fixed
          // value = value[0] to avoid  outer loop;
          value.programming_class.forEach((p) => {
              // p is not an array
              let keys = Object.keys(p);
              keys.forEach((k) => {
                  let classObj = p[k];
                  console.log(classObj);
                  // now you can perform actions on this object i-e: sum, multiple whatever
              });
          });
      }
  })
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>

​

Answer 3

这是因为您忘了添加这个，JSON.parse()，当您从服务器获得结果时，它以文本或未格式化的json字符串的形式返回，您必须通过该函数传递它，以便javascript正确呈现。

所以在这里我们会有-

 success: function(data) {

        data = JSON.parse(data);

        console.log('success');
        for (key in data) {
            var value = data[key];

    ...

请注意，从web服务器接收数据时，数据始终为字符串。我希望这能帮到你。