如何从JSON对象中的数组中获取键名及其值

时间:2017-02-08 08:59:18

标签: jquery json

我的问题

在我的JSON文件中,我在一个对象中有一个对象,其值是键/值对的数组。我无法输出每个密钥名称及其值。

我的代码

menu.json

{"themenu":[
    {
        "stuff": "stuffs",
        "pages": [
            {"name1": "page111"},
            {"name2": "page222"},
            {"name3": "page333"}
        ]
    }
]}

menu.js

$(function() {
    $.getJSON('menu.json', function(data) {
        $(data.themenu).each(function() {
            var stuff = this.stuff;
            alert(stuff); // alerts 'stuffs'
            $(this.pages).each(function(key, value) { 
                var pageName = this.key;
                var pageUrl = this.value;
                alert(pageName + ' ' + pageUrl);
            })
        })
    })
})

我的要求

我想输出密钥的名称及其对应的值,因此它将与此相同......

alert('name1 page111');
alert('name2 page222');
alert('name3 page333');

我尝试过的事情

我尝试过一些事情,包括......

$(data.pages).each(function(key, value) { 
    var pageName = this.key;
    var pageUrl = this.value;
})

......还有一堆伏都教,我不好意思发帖。

3 个答案:

答案 0 :(得分:2)

您可以使用forEach方法使用vanilla JavaScript迭代数组,然后使用Object.keys()检索对象的键。



var json_data = {
  "themenu": [{
    "stuff": "stuffs",
    "pages": [{
      "name1": "page111"
    }, {
      "name2": "page222"
    }, {
      "name3": "page333"
    }]
  }]
}


json_data['themenu'].forEach(function(menu) {
  menu.pages.forEach(function(page) {
    alert(Object.keys(page)[0] + ' ' + page[Object.keys(page)[0]]);
  });
});




答案 1 :(得分:2)

循环使用JSON并使用this.key / this.value时,您实际上会搜索密钥key / value(如果它是{'key': ..., 'value': ...}

您的$.each(this.pages, function (key, value)会为您提供所需值的数组。您可以再次循环以获取键/值作为文本:

var json = {
  "pages": [{
    "name1": "page111"
  }, {
    "name2": "page222"
  }, {
    "name3": "page333"
  }]
};

$.each(json.pages, function(k, v) {
  console.log(k, v);
  $.each(this, function(key, value) {
    console.log('->', key, value);
    //alert(keyName + ' ' + value);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

答案 2 :(得分:2)

只需使用此代码即可。我刚刚更改了代码的一些内容,试试这个::

var json_data = {"themenu":[
    {
        "stuff": "stuffs",
        "pages": [
            {"name1": "page111"},
            {"name2": "page222"},
            {"name3": "page333"}
        ]
    }
]};
$(document).ready(function() {
//  $.getJSON(json_data, function(data) {
        $(json_data.themenu).each(function() {
            var stuff = this.stuff;
            alert(stuff); // alerts 'stuffs'
            $(this.pages).each(function(key, value) { 
                $.each(this, function(key, value) {
                    var pageName = key;
                    var pageUrl = value;
                    alert(pageName + ' ' + pageUrl);
                });
            });
        });
//    })
});

假设var json_data拥有您的数据,请根据需要进行替换。