Not able to Fetch Json

I want to Fetch a json to display only syn in a div.

its like:--

$.getJSON('http://words.bighugelabs.com/api/2/eba286cdc7f3619674544d80ce94cb1b/stack/json', function(data) {

         //parse the response to display in a div


        });

output format.

JSON markup from link:

{
    "noun": {
        "syn": [
            "batch",
            "deal",
            "flock",
            "good deal",
            "great deal",
            "hatful",
            "heap",
            "lot",
            "mass",
            "mess",
            "mickle",
            "mint",
            "muckle",
            "peck",
            "pile",
            "plenty",
            "pot",
            "quite a little",
            "raft",
            "sight",
            "slew",
            "spate",
            "tidy sum",
            "wad",
            "push-down list",
            "push-down stack",
            "smokestack",
            "push-down storage",
            "p开发者_运维技巧ush-down store",
            "agglomerate",
            "chimney",
            "cumulation",
            "cumulus",
            "large indefinite amount",
            "large indefinite quantity",
            "list",
            "listing",
            "memory device",
            "mound",
            "storage device",
            "whole lot",
            "whole slew"
        ]
    },
    "verb": {
        "syn": [
            "pile",
            "heap",
            "arrange",
            "lade",
            "laden",
            "load",
            "load up",
            "set up"
        ],
        "rel": [
            "heap up",
            "pile up",
            "stack away",
            "stack up"
        ]
    }
}

The JSON fails to load because of the Same Origin Policy, just append ?callback=? to your world and it'd work. The updated code,

$.getJSON('http://words.bighugelabs.com/api/2/eba286cdc7f3619674544d80ce94cb1b/stack/json?callback=?', function(data) {
    //parse the response to display in a div
    //you can access the JSON object from the data object.
});

Update:

And when you append a ?callback=? to the URL used in $.getJSON, jQuery understands that it's a JSONP request and not a XMLHttpRequest to fetch JSON. Actually the callback parameter can be anything thing, but the value must be ? to trigger a JSONP request.

When making the request jQuery replaces the parameter something as ?callback=jQuery15107307685413397849_1299439987443, the value will be unique every time you make a request.

You haven't mentioned what problems you're running in to. As is, if you are running the posted code on the domain, 'words.bighugelabs.com', then inside your callback function you can simply access:

data.verb.syn

or any other properties. If you're not on that domain, then you're probably running into the problems associated with cross domain scripting restrictions. If that is the case, you'll want to look into JSONP (if the remote server supports it) or a proxying methodology.

Ok, I see the JSON response from the URL you've provided. You can do something like this (you could make it more efficient by using a StringBuilder):

var list;

var syn = data.noun.syn;

for(var i = 0; i < syn.length; i++)
{
    list += syn[i];
}

syn = data.verb.syn;

for(var i = 0; i < syn.length; i++)
{
    list += syn[i];
}

$('#mydiv').append(list);

In the future, please be more specific about what the problem is that you're facing -

• Were you not able to fetch the JSON? See @JAAulde's answer; the part about the Same Origin Policy
• Were you not able to parse the JSON? See my answer and take a look at JSON.org or perhaps this tutorial.
• Was there something else? Please update your question.