如何在javascript和jquery中迭代json对象数组?

How to iterate json object array in javascript and jquery?

本问题已经有最佳答案,请猛点这里访问。

我正在学习JavaScript和JSON对象和数组。我被赋予了迭代以下数组的任务:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
{"6784":
    {"OD":
        [
            {
               "od_id":"587641",
               "cl_type":"scl",
               "cl_eye":"OD"
            }
        ],
    }
    {"OS":
        [
            {
               "od_id":"587641",
               "cl_type":"scl",
               "cl_eye":"OD"
            }
        ],
    }
}

我尝试使用简单的for循环和jquery来迭代每个循环,但它不起作用。条件是我们不知道任何键名。


您的json不是有效的json.enter image description here

有效的JSON应该如下:氧化镁

工作演示

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
var jsonObj = {
    "6784": {
        "OD": [{
            "od_id":"587640",
            "cl_type":"scl",
            "cl_eye":"OD"
        }],
        "OS": [{
            "od_id":"587641",
            "cl_type":"scl",
            "cl_eye":"OD"
        }]
    }
};

var keys = Object.keys(jsonObj);
for (var i in keys) {
  var innerKeys = Object.keys(jsonObj[keys[i]]);
  for (var j in innerKeys) {
    console.log(jsonObj[keys[i]][innerKeys[j]][0].od_id);
  }
}


如果您不知道键名,可以使用object.keys(json_obj)。

1
2
3
Object.keys(json_obj).forEach(function(key){
   stuff
}


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
**index.html**

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
Document


</head>
<body>





<script
src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous">

<script src="js/main.js">

</body>
</html>



**js/main.js**

$(document).ready(function(){

console.log(data)

function parse(data){

for (var item in data['6784']) {
  for (var i = 0; i < data['6784'][item].length; i++) {
      var od_id = data['6784'][item][i].od_id;
      var cl_type = data['6784'][item][i].cl_type;
      var cl_eye = data['6784'][item][i].cl_eye;

      console.log(item + ', ' + od_id + ', ' + cl_type + ', ' + cl_eye);

      $("#content").append(
        ''+  
        '<p>
<span class="item">item: </span> '
+ item + '
</p>'
+
        '<p>
<span class="item">od_id: </span> '
+ od_id + '
</p>'
+
        '<p>
<span class="item">cl_type: </span> '
+ cl_type + '
</p>'
+
        '<p>
<span class="item">cl_eye: </span> '
+ cl_eye + '
</p>'
+
        ' '
      );

    }
  }

}

$.ajax({
 url: 'data.json',
 dataType:"json",
 success: parse,

});
});





**data.json**

{"6784":
    {"OD":
        [
            {
               "od_id":"587641",
               "cl_type":"scl",
               "cl_eye":"OD"
            }
        ],
   "OS":
        [
            {
               "od_id":"58764-2",
               "cl_type":"scl-2",
               "cl_eye":"OS"
            }
        ]
    }
}


{}表示一个对象,而不是一个数组,您可以用多种方式迭代其属性:

遍历对象属性

您可能还想看看:

循环遍历对象(树)


您可以使用:

1
Object.keys(Obj)

以标识对象上的属性,然后可以对其进行迭代以查找每个属性的值。