jQuery读取JSON文件

jQuery ajax - getJSON()方法：

$.getJSON("test.json",function(data){

    alert(data[0].name);

});

该函数是简写的Ajax函数，等价于：

$.ajax({

    url: url,

    data: data,

    success: callback,

    dataType: json

});

附加参数：

$.getJSON("test.js",{name:"John",time:"2pm"},function(data){

    alert(data[0].name);

});

举例：

article.json文件：

[

{"title":"aaaaaaaaa","content":"bbbbbbbbbbbbbbbbbb","page":"1"},

{"title":"ccccccccc","content":"dddddddddddddddddd","page":"2"},

{"title":"eeeeeeeee","content":"ffffffffffffffffff","page":"3"}

]

js文件：

$(function(){

    //点击显示更多

    var i = 1;    //初始页数为1

    $('.more').click(function(){

        $('.p_2').show();

        setTimeout(function(){

            $.getJSON("article.json",function(data){

                //过滤

                data = $.grep(data,function(item){

                    return item.page == i;

                });

                if(data && data != ''){

                    //循环

                    $.each(data,function(index,array){

                        var content = "<ul><li class='li_1'><a href='#'><img src='' alt=''></a></li><li class='li_2'><h2>"+array['title']+"</h2><p>"+array['content']+"</p></li></ul>";

                        $('.content').append(content);

                    });

                    i++;

                }else{

                    $('.more a').html("没有更多了");

                }

                $('.p_2').hide();

            });

        },1000);

    });

});