Question

告诉我如何通过jquery解析json格式的任何数据。如果数据中有第n级嵌套，请告诉我如何解析它或循环迭代并显示其关键名称＆amp; alert（）中的值。

帮助我构建单个jquery例程，它可以解析json格式的任何类型的数据在数据中嵌套第n 级别。所以我在这里以json格式提供一些样本数据集。

SET 1

{
"employees": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}

SET 2

{
    "glossary": {
        "title": "example glossary",
        "GlossDiv": {
            "title": "S",
            "GlossList": {
                "GlossEntry": {
                    "ID": "SGML",
                    "SortAs": "SGML",
                    "GlossTerm": "Standard Generalized Markup Language",
                    "Acronym": "SGML",
                    "Abbrev": "ISO 8879:1986",
                    "GlossDef": {
                        "para": "A meta-markup language, used to create markup languages such as DocBook.",
                        "GlossSeeAlso": ["GML", "XML"]
                    },
                    "GlossSee": "markup"
                }
            }
        }
    }
}

SET 3

{"menu": {
  "id": "file",
  "value": "File",
  "popup": {
    "menuitem": [
      {"value": "New", "onclick": "CreateNewDoc()"},
      {"value": "Open", "onclick": "OpenDoc()"},
      {"value": "Close", "onclick": "CloseDoc()"}
    ]
  }
}}

SET 4

{"widget": {
    "debug": "on",
    "window": {
        "title": "Sample Konfabulator Widget",
        "name": "main_window",
        "width": 500,
        "height": 500
    },
    "image": { 
        "src": "Images/Sun.png",
        "name": "sun1",
        "hOffset": 250,
        "vOffset": 250,
        "alignment": "center"
    },
    "text": {
        "data": "Click Here",
        "size": 36,
        "style": "bold",
        "name": "text1",
        "hOffset": 250,
        "vOffset": 100,
        "alignment": "center",
        "onMouseUp": "sun1.opacity = (sun1.opacity / 100) * 90;"
    }
}}

SET 5

{
    "id": "0001",
    "type": "donut",
    "name": "Cake",
    "ppu": 0.55,
    "batters":
        {
            "batter":
                [
                    { "id": "1001", "type": "Regular" },
                    { "id": "1002", "type": "Chocolate" },
                    { "id": "1003", "type": "Blueberry" },
                    { "id": "1004", "type": "Devil's Food" }
                ]
        },
    "topping":
        [
            { "id": "5001", "type": "None" },
            { "id": "5002", "type": "Glazed" },
            { "id": "5005", "type": "Sugar" },
            { "id": "5007", "type": "Powdered Sugar" },
            { "id": "5006", "type": "Chocolate with Sprinkles" },
            { "id": "5003", "type": "Chocolate" },
            { "id": "5004", "type": "Maple" }
        ]
}

更新问题

var obj ={
        "id": "0001",
        "type": "donut",
        "name": "Cake",
        "ppu": 0.55,
        "batters":
            {
                "batter":
                    [
                        { "id": "1001", "type": "Regular" },
                        { "id": "1002", "type": "Chocolate" },
                        { "id": "1003", "type": "Blueberry" },
                        { "id": "1004", "type": "Devil's Food" }
                    ]
            },
        "topping":
            [
                { "id": "5001", "type": "None" },
                { "id": "5002", "type": "Glazed" },
                { "id": "5005", "type": "Sugar" },
                { "id": "5007", "type": "Powdered Sugar" },
                { "id": "5006", "type": "Chocolate with Sprinkles" },
                { "id": "5003", "type": "Chocolate" },
                { "id": "5004", "type": "Maple" }
            ]
    }

$.each( obj, function( key, value ) {
      alert( key + ": " + value );
});

如果我以这种方式编写代码......是否有效？

嵌套密钥＆amp;值可以这样迭代吗？请提一下。感谢

Answer 1

您从一个包含n属性的对象开始。在jQuery（使用n函数）和本机JavaScript（使用jQuery.each()循环）中迭代这些for(key in object)属性并显示其键值对非常简单。但是，该迭代只下降了一个级别;如果其中一个属性指向数组或另一个对象会发生什么？

理想情况下，你所拥有的是一个递归函数，它检查属性值的类型，并相应地处理它;在非数组非对象值的情况下，它只输出键和值，否则它将迭代该嵌套数组或对象，执行相同的操作。

这样的事情：

function iterateObject(key, obj) {
    if(typeof obj == "object") {
        console.log(key + ":");
        $.each(obj, function(key, obj) {
            iterateObject(key, obj);
        });
    }
    else if(typeof obj == "array") {
        console.log(key + ":");
        $.each(obj, function(i, value) {
            iterateObject(i, value);
        });
    }
    else {
        // not an object, not an array - need to output it.
        console.log(key + ": " + obj);
    }
}

$.each(obj, function(key, obj) {
    iterateObject(key, obj);
});

您可以在this jsFiddle demo中看到它。

Answer 2

这些可能会帮助你：

Array.prototype.indexOf - 返回在数组中可以找到给定元素的第一个索引，如果不存在则返回-1
jQuery.each - 一个通用迭代器函数，可用于无缝迭代对象和数组

如何通过jquery解析json格式的任何类型的数据

更新问题

2 个答案: