0

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

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']
}];
4

6 回答 6

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 的替代方法,您可以使用本机 javascriptfilter函数来实现相同的目标:

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']
}
于 2013-10-06T12:29:44.763 回答
0

您还可以使用纯 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"
        ]
};
于 2013-10-06T12:34:16.863 回答
0

因此,您将 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/

于 2013-10-06T12:38:01.983 回答
0

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

至于其余的问题:(非jquery解决方案)

仅检索“键”(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]

看这里

于 2013-10-06T12:39:30.013 回答
0

这会帮助你!

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);
}
于 2013-10-06T12:28:57.020 回答
0

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

否则,只需访问对象属性:main[0].keymain[1].data

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

于 2013-10-06T12:31:04.360 回答