使用 jQuery 和 Javascript 解析本地 JSON 文件
Posted
技术标签:
【中文标题】使用 jQuery 和 Javascript 解析本地 JSON 文件【英文标题】：Parse local JSON file with jQuery and Javascript 【发布时间】：2013-07-30 10:36:02 【问题描述】：我正在尝试解析我计算机上的 JSON 文件。我想解析它。 JSON 文件的结构如下：
"sites":
"site": [
"id": "01",
"name": "Sito 1",
"src": "localhost/root/coupon/sito1",
"expiryDate": "29 Ago 2013"
,
"id": "02",
"name": "Sito 2",
"src": "localhost/root/coupon/sito2",
"expiryDate": "30 Ago 2013"
,
"id": "Sito 3",
"name": "Sito 3",
"src": "localhost/root/coupon/sito2",
"expiryDate": "31 Ago 2013"
]
在我的 html 中，我导入了 jQuery 库，并创建了一个在页面加载时加载的函数。代码如下：
<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
<title>Lista coupon</title>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript" charset="utf-8">
function loadJson()
window.alert("Carico il contenuto del file JSON per popolare la lista");
$(document).ready(function()
$.getJSON('data.json', function(json)
console.log(json);
);
);
</script>
</head>
<body onload="loadJson();">
<div id="header">
<h1>Lista coupon salvati</h1>
</div>
<div id="content">
<p>Di seguito trovi tutte le promozioni salvate</p>
</div>
<div id="footer">
</div>
</body>
</html>
现在我在 firebug 控制台上看到它可以正确读取 JSON 文件，但我不知道如何解析这个 JSON。我在谷歌搜索，但我发现了很多使用远程 JSON 的示例。你能帮我理解如何解析本地 JSON 文件吗？ 谢谢
PS：注意我在这里发布的网站是为移动浏览器制作的。
【问题讨论】：
getJson 向 服务器 而非您的计算机发出 HTTP 调用。阅读文档api.jquery.com/jQuery.getJSON 对 'obj' 变量执行 console.log 并检查它是如何构建的。会让你明白你应该如何使用它。 【参考方案1】：getJSON 会为你解析。
只需删除 var obj = $.parseJSON(json); 行（因为这会将对象字符串化并尝试将其解析为 JSON（它不会是）。
【讨论】：
好的，我删除了它，但现在我如何才能访问该对象？现在我想“捕获”条目“name”和“src”json 是对象。像任何其他人一样访问它。 (json.sites.etc)
所以我只需要简单地使用 json.name 和 json.src 来获取名称和链接吗？我用警报尝试了它，但它说我未定义......
不，因为name 和src 不是存储在json 中的对象的属性。您必须深入了解层次结构。您可能想阅读Objects in JavaScript。
使用 json.sites.site[0].src ,json.sites.site[1].src【参考方案2】：
我认为您不需要解析 json。由于您使用的是 $.getJSON()，它将自动解析 json。
【讨论】：
使用 json.sites.site[0].src ,json.sites.site[1].src 现在如何将 name 和 src 的值放入一个数组中？使用 $.each 对吗？ 好的，我如何识别我正在阅读“name”或“src”或“id”或“expiryDate”？我做到了$.each(json, function(key, value) );
$.each(json.sites.site,function(index,value) alert(value.src);)以上是关于使用 jQuery 和 Javascript 解析本地 JSON 文件的主要内容，如果未能解决你的问题，请参考以下文章
如何使用 jQuery / JavaScript 解析 JSON 数据？
使用 Javascript/JQuery 解析自动生成的 .NET 日期对象
JavaScript 使用ajax / jquery解析wordpress RSS feed
Javascript/jQuery - 使用正则表达式解析字符串中的主题标签，URL 中的锚点除外