【JavaScript】js遍历json

最新推荐文章于 2025-05-17 14:20:52 发布

断桥残雪D

最新推荐文章于 2025-05-17 14:20:52 发布

阅读量808

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript

本文链接：https://blog.youkuaiyun.com/qq_30141957/article/details/79934639

JavaScript 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了两种在JavaScript中遍历JSON数据的方法：一种是利用jQuery的$.each方法，适用于获取JSON对象中的每对键值；另一种是使用传统的for循环，特别是针对数组时，可以通过索引遍历获取键值。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

下面介绍js遍历json数据的几种方法

方法一：jQuery

例一：

json数据如下，需要获得每对key和value

{"a":4.3,"classify":"Iris-setosa","b":3.0,"c":1.1,"d":0.1}

可以使用jQuery中的$.each方法，使用jQuery之前，需要在html中使用如下标签引入jQuery

<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>

然后在js代码中这么写：

var data = {"a":4.3,"classify":"Iris-setosa","b":3.0,"c":1.1,"d":0.1}
var key = [];
var value = [];
$.each(data, function(i){
	key.push(i);// i代表 "a"，"classify"等等key
	value.push(data[i]);// data[i]得到key=i对应的value
});

例二：如果想获得数组的key，只需要使用data1.data[0]，先获得第一条数据，然后遍历即可。

var data1 = 
{"data":
	[
		{"a":4.3,"classify":"Iris-setosa","b":3.0,"c":1.1,"d":0.1},
		{"a":5.7,"classify":"Iris-setosa","b":3.8,"c":1.7,"d":0.3},
		{"a":5.1,"classify":"Iris-setosa","b":3.7,"c":1.5,"d":0.4},
		{"a":5.1,"classify":"Iris-setosa","b":3.3,"c":1.7,"d":0.5}
	]
};

var key = [];
var value = [];
$.each(data1.data[0], function(i){ 
	key.push(i);// i代表 "a"，"classify"等等key
});

方法二：使用for方法

var data = {"a":4.3,"classify":"Iris-setosa","b":3.0,"c":1.1,"d":0.1}
var value = [];
for(i in data){
	value.push(i);//只能获得value
}