1

我需要解析以下 json 响应。

{
"attrs": {
    "width": 578,
    "height": 200
},
"nodeType": "Stage",
"children": [
    {
        "attrs": {},
        "nodeType": "Layer",
        "children": [
            {
                "attrs": {
                    "x": 289,
                    "y": 100,
                    "sides": 6,
                    "radius": 70,
                    "fill": "red",
                    "stroke": "black",
                    "strokeWidth": 4
                },
                "nodeType": "Shape",
                "shapeType": "RegularPolygon"
            }
        ]
    }
]
}

任何帮助谢谢..

4

4 回答 4

4

我们可以很容易地解析使用JSON.parse(YOUR-JSON-STRING)

var jsonStr = '{ "attrs": { "width": 578, "height": 200 }, "nodeType": "Stage", "children": [ { "attrs": {}, "nodeType": "Layer", "children": [ { "attrs": { "x": 289, "y": 100, "sides": 6, "radius": 70, "fill": "red", "stroke": "black", "strokeWidth": 4 }, "nodeType": "Shape", "shapeType": "RegularPolygon" } ] } ] }';

将它们放在一起最终解决方案将如下所示

var jsonStr = '{ "attrs": { "width": 578, "height": 200 }, "nodeType": "Stage", "children": [ { "attrs": {}, "nodeType": "Layer", "children": [ { "attrs": { "x": 289, "y": 100, "sides": 6, "radius": 70, "fill": "red", "stroke": "black", "strokeWidth": 4 }, "nodeType": "Shape", "shapeType": "RegularPolygon" } ] } ] }';

var parsedData = JSON.parse(jsonStr);
alert(parsedData.attrs.width)


$.each(parsedData.children, function (index, value) {
    $.each(this.children, function (index, value) {
        $('#mydata').append(' x value is : '+this.attrs.x);
        $('#mydata').append(' y value is : '+this.attrs.y);
    });
    console.log(this);
});

这是一个现场示例http://jsfiddle.net/mayooresan/bMHN8/

于 2013-04-03T10:23:37.350 回答
1 
var data = '{ "attrs": { "width": 578, "height": 200 }, "nodeType": "Stage", "children": [ { "attrs": {}, "nodeType": "Layer", "children": [ { "attrs": { "x": 289, "y": 100, "sides": 6, "radius": 70, "fill": "red", "stroke": "black", "strokeWidth": 4 }, "nodeType": "Shape", "shapeType": "RegularPolygon" } ] } ] }';

 var _json = JSON.parse(data);


    console.log(_json.attrs.width);

如果您在 jQuery 中通过 Ajax 检索 JSON，您可以执行以下操作：

 $.ajax({
    /* Set the JSON datatype in ajax call*/
    dataType:'json',
    ...
/* get json in response and you already have it "parsed" */
     success:function(json){

     console.log(json.attrs.width);
    }
    ...
    });
于 2013-04-03T10:24:23.080 回答
0

使用parseJSON方法：

var obj = $.parseJSON(json);

如果您进行 AJAX 调用以获取数据，请指定 JSON 数据类型，然后将自动为您解析响应：

$.ajax({
  url: "jsondata",
  dataType: "json",
  success: function(obj) {
    alert(obj.nodeType);
  }
});
于 2013-04-03T10:35:12.837 回答
0

使用点表示法，您可以访问 JSON 数据的属性和对象。

首先，将您的 JSON 响应分配给一个变量，例如

var json = { "attrs": { "width": 578, "height": 200 }, "nodeType": "Stage", "children": [ { "attrs": {}, "nodeType": "Layer", "children": [ { "attrs": { "x": 289, "y": 100, "sides": 6, "radius": 70, "fill": "red", "stroke": "black", "strokeWidth": 4 }, "nodeType": "Shape", "shapeType": "RegularPolygon" } ] } ] }

例如，获取 JSON 数据对象的宽度并通过控制台显示：

console.log(json.attrs['width']);

回报：578

然后获取嵌套对象的值，例如

console.log(json.children[0].children[0].attrs);

返回： 具有 x、y、边、半径等属性的对象。

要访问这些，例如

console.log(json.children[0].children[0].attrs['radius']);

回报：70

这里对点和括号表示法/语法有一个更一般的答案：How to extract a json object that's inside a json object

于 2013-04-03T10:45:07.903 回答