使用 jQuery 浏览和阅读 JSON - for 和 $.each

让我们通过这个简单的 jQuery 示例来浏览 JavaScript 对象数组。

var json = [
{id”:1”,text”:paris”},
{id”:2”,text”:marseille”},
{id”:3”,text”:里尔”},
{id”:4”,text”:梅斯”},
{id”:5”,text”:renne”}
];

$.each(json, function(i, obj) {
alert(obj.text);
});
此示例的执行正确运行,城市显示在警报框中。使用单引号或双引号声明字符串 JSON 的常见问题.

var json = '[{id”:1”,city”:paris”},{id”:2”,city”:marseille”},
{id”:3”,city”:lille”},{id”:4”,city”:metz”},
{id”:5”,city”:驯鹿”}]';

$.each(json, function(i, obj) {
alert(obj.city);
});
Chrome 浏览器在控制台中显示此错误:

Uncaught TypeError:无法使用in”运算符搜索...
in [{id”:1”,ville”:paris”}...
理想的解决方案是使用 JSON.parse() 函数或 jQuery 函数将 JSON 转换为 JavaScript 对象 $.parseJSON.

$.each(JSON.parse(json), function(i, obj) {
alert(obj.ville);
});

//ou

$.each($.parseJSON(json), function(i, obj) {
alert(obj.city);
});

JSON 示例和 JavaScript 循环 for

以下示例展示了如何使用 JavaScript for loop.

<!HTML 文档类型>

<头>
<元字符集=UTF-8”>
<标题>javascript for 和 JSON 循环的示例
<脚本 src=https://code.jquery.com/jquery-1.10.2.js”>

<身体>

<脚本>
$(function() {

var data = [
{id”:1”,name”:一”},
{id”:2”,name”:Two”},
{id”:3”,name”:Three”},
{id”:4”,name”:Four”},
{id”:5”,name”:Five”}
];

var data_length = data.length;
for (var i = 0; i < data_length; i++) {
alert(data[i][id”] + ” + data[i][name”]);
}
});



Resources:
jQuery each() method
如何在jquery