jquery parsing JSON data

{"Comments": [{"Content": "Very good", "id": 1, "nickname": "Nani"},{"content": "Yo West yo West", "id": 2, "nickname": "Johnny"}]}

To get the JSON data, there is a simple method $.getjson () in jquery that can be implemented.

The following is a description of the official API for $.getjson ():

Jquery.each (Collection, Callback (Indexinarray, valueofelement))

Collection The object or array to iterate over.

callback (Indexinarray, valueofelement) The function that would be is executed on every object.

The $.each () method accepts two parameters, the first is the collection of objects that need to be traversed (a collection of JSON objects), the second is the method to traverse, the method accepts two parameters, the first is the index of the traversal, and the second is the value that is currently traversed. Haha, with the $.each () method JSON parsing will be solved. (*^__^*) hehe ...

function Loadinfo () {
    $.getjson ("Loadinfo", function (data) {
        $ ("#info"). HTML ("");//Empty info content
        $.each (data.comments, function (I, item) {
            $ ("#info"). Append (
                    
                    "<div>" + item.nickname    + "</div>" +
                    "<div>" + item.content + "</div>        });
        });
}

As above, Loadinfo is the requested address, function (data) {...} is the callback function after the request succeeds, data encapsulates the returned JSON object, in the following $.each (Data.comments,function (I,item) {...}) The Data.comments method directly reaches the JSON array contained within the JSON data:

[{"Content": "Very good", "id": 1, "nickname": "Nani"},{"content": "Yo Xi yo XI", "id": 2, "nickname": "Xiao Qiang"}]

The function in the $.each () method is to iterate over the array and insert it into the appropriate place by manipulating the DOM. During the traversal, we can easily access the currently traversed index ("I" in the code) and the currently traversed value ("item" in the code).

The result of the above example is as follows:

If the JSON data returned is more complex, then only a few more $.each () can be traversed, hehe. For example, the following JSON data:

{"Comments": [{"Content": "Very good", "id": 1, "nickname": "Nani"},{"content": "Yo West yo West", "id": 2, "nickname": "Johnny"}], "Content": " You're a wood man, haha. "," Infomap ": {" gender ":" Male "," occupation ":" Programmer "," blog ":" http:\/\/www.cnblogs.com\/codeplus\/"}," title ":" 123 Wood Man "}

JS as follows:

function Loadinfo () {
    $.getjson ("Loadinfo", function (data) {
        $ ("#title"). Append (data.title+ "        $ ("#content"). Append (data.content+ "        jquery Parses map data
        $.each (Data.infomap,function (key,value) {
            $ ("#mapinfo"). Append (key+ "----" +value+ "<br/>        });
        Parsing arrays
        $.each (data.comments, function (I, item) {
            $ ("#info"). Append (
                    
                    "<div>" + item.nickname    + "</div>" +
                    "<div>" + item.content + "</div>        });
        });
}

It is important to note that when $.each () traverses a map, the parameters in function () are key and value, which is very convenient.

The performance of the above example:

jquery is very powerful, so ... More understanding also have to refer to the document, (ˇ?ˇ) want ~

jquery parsing JSON data