Question

如何从下面的数组中检索数据。如何按类别检索数据。如何只检索键值如何只检索数据值

var main = [{
   "key": "all",
   "data": ['img/icon1.png', 'img/icon2.png', 'img/icon3.png']
}, {
   "key": "cat1",
   "data": ['img/icon1.png', 'img/icon2.png', 'img/icon3.png']
}, {
   "key": "cat2",
   "data": ['img/icon1.png', 'img/icon2.png']
}, {
   "key": "cat3",
   "data": ['']
}, {
   "key": "cat4",
   "data": ['']
}, {
   "key": "cat5",
   "data": ['img/icon1.png']
}];

Answer 1

您可以使用.grep功能：

var category = 'cat2';

var result = $.grep(main, function() {
    return this.key === category;
});

if (result.length > 0) {
    // We have found an element in the array that satisfies the condition
    // => we could access it's data property:
    var data = result[0].data; // this will equal to ['img/icon1.png', 'img/icon2.png']
}

作为使用jQuery的替代方法，您可以使用本机javascript filter函数来实现相同的目标：

var result = main.filter(function(element) {
    return element.key === category;
});

if (result.length > 0) {
    // We have found an element in the array that satisfies the condition
    // => we could access it's data property:
    var data = result[0].data; // this will equal to ['img/icon1.png', 'img/icon2.png']
}

Answer 2

这会对你有帮助！

http://jsfiddle.net/kasperfish/2XJNt/

alert(main[0].data);

或者如果你想循环主变量

http://jsfiddle.net/kasperfish/2XJNt/1/

for (var i=0;i<main.length;i++)
{
    alert(main[i].data);
}

Answer 3

如果JSON数据来自某个地方的API或文件，请使用http://api.jquery.com/jQuery.getJSON/。

否则只需访问对象属性：main[0].key或main[1].data

示例：http://jsfiddle.net/WmEbU/

Answer 4

您还可以使用纯JavaScript重新组织数据，如下所示：

var flat_data = [];
var all_keys = []
var data_by_cat = {};

for (var i = 0; i < main.length; ++i) {

   var item = main[i];

   // check if you already saved that key
   if (all_keys.indexOf(item['key']) == -1) {

      all_keys.push(item['key']);

      // you also need to add a new key to data_by_cat
      data_by_cat[item['key']] = [];

   }

   // append all data to flat_data and data_by_cat
   for (var j = 0; j < item['data'].length; ++j) {

      flat_data.push(item['data'][j]);
      data_by_cat[item['key']].push(item['data'][j]);

   }

}

然后，您将获得data中的所有flat_data元素，all_keys中的键列表以及将您的键作为键的字典以及每个类别的所有数据的数组一个值，像这样：

var flat_data = [
    "img/icon1.png",
    "img/icon2.png",
    "img/icon3.png",
    "img/icon1.png",
    "img/icon2.png",
    "img/icon3.png",
    "img/icon1.png",
    "img/icon2.png",
    "",
    "",
    "img/icon1.png"
    ];

var all_keys = [
    "all",
    "cat1",
    "cat2",
    "cat3",
    "cat4",
    "cat5"
    ];

var data_by_cat = {
    "all": [
        "img/icon1.png",
        "img/icon2.png",
        "img/icon3.png"
        ],
    "cat1": [
        "img/icon1.png",
        "img/icon2.png",
        "img/icon3.png"
        ],
    "cat2": [
        "img/icon1.png",
        "img/icon2.png"
        ],
    "cat3": [
        ""
        ],
    "cat4": [
        ""
        ],
    "cat5": [
        "img/icon1.png"
        ]
};

Answer 5

因此，您将JSON存储在对象中。现在该对象是纯Javascript数组。所以迭代它并获得价值。

for(var i=0;i<main.length;i++){
    alert('Key['.concat(i).concat('] =').concat(main[i].key));
    alert('data['.concat(i).concat('] =').concat(main[i].data));
}

我作为小提琴的例子的解决方案 - http://jsfiddle.net/hunkyhari/grttY/1/

Answer 6

你想要的数据已经从json“检索”了，因为它在代码本身，分配给一个变量，解释器已经有了数组

至于其他问题:(非jquery解决方案）

仅检索“keys”（数组中每个元素的element.key值）：

main.map(function (a) {return a.key})

仅检索数据：

main.map(function (a) {return a.data})

并按类别检索：

main.filter(function(a){return a.key===category})[0]

see here

如何从对象数组中检索数据（可用JQuery）

6 个答案: