jQuery getJSON()的用法（附带实例）

JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串，然后就可以在函数之间轻松地传递这个字符串。

JSON 格式的文件很方便计算机的读取，因此受到开发人员的青睐。在 jQuery 中 $.getJSON() 方法用于加载 JSON 文件，它的用法与 $.getScript() 方法的用法相同。

例如，要加载 test.json 文件，具体代码如下：

$("#btn").click(function(){
    $.getJSON("test.json",回调函数);
})

【实例】使用 $.getJSON() 方法加载 JSON 文件。
1) 创建 index.html 页面，在页面中加入一个 id 属性值为 json 的 <div> 空元素，代码如下：

<div id="json"></div>

2) 创建 test.json 文件，内容为：

[
    {
        "name":"轻鸿",
        "sex":"女",
        "email":"xiaoyuan@qq.com"
    },
    {
        "name":"沐汐",
        "sex":"女",
        "email":"mxxx@163.com"
    }
]

test.json 文件中的内容，首尾分别用 [ 和 ] 括起来，表示这是一个含有两个对象的数组。

3) 在 index.html 页面中加载 test.json 文件，加载完毕后执行回调函数，首先定义一个空的字符串 htmlStr，然后使用 $.each() 方法遍历返回的数据（即第 1 个参数 data），并以一个回调函数作为第 2 个参数（回调函数有两个参数，第 1 个参数是对象的成员或数组的索引，第 2 个参数是对应的变量或内容），将结果保存在 htmlStr 字符串中。具体代码如下：

$.getJSON("test.json",function(data){
    var htmlStr = "";
    $.each(data,function(index,info) {
        htmlStr+="姓名："+info['name']+"<br/>";
        htmlStr+="性别："+info['sex']+"<br/>";
        htmlStr+="邮箱："+info['email']+"<br/><br/>";
    })
    $("#json").html(htmlStr);
})

运行本实例，最终效果如下图所示：