jQuery access JSON Object

Question

How do I access the name of an item in an Object Literal using jQuery?

For example how would I read "title", "link", "media", ect... in this

{
    "title": "What we do in our free time...",
    "link": "http://www.flickr.com/photos/tnhimmies/4042938515/",
    "media": {"m":"http://farm3.static.flickr.com/2572/4042938515_3a00561320_m.jpg"},
    "date_taken": "2009-10-24T03:48:10-08:00",
    "description": "<p><a href=\"http://www.flickr.com/people/tnhimmies/\">Darlene, TN Persians (www.tnpurrs.com)<\/a> posted a photo:<\/p> <p><a href=\"http://www.flickr.com/photos/tnhimmies/4042938515/\" title=\"What we do in our free time...\"><img src=\"http://farm3.static.flickr.com/2572/4042938515_3a00561320_m.jpg\" width=\"240\" height=\"230\" alt=\"What we do in our free time...\" /><\/a><\/p> <p>Tennessee Persians<br /> <a href=\"http://www.tnpurrs.com\" rel=\"nofollow\">www.tnpurrs.com<\/a><\/p>",
    "published": "2009-10-25T18:28:36Z",
    "author": "[email protected] (Darlene, TN Persians (www.tnpurrs.com))",
    "author_id": "66405213@N00",
    "tags": "cat persian tnpurrs"
},

BTW, it isn't an associative array is an Object Literal is.gd/4BdvZ — Christian C. Salvadó
– Christian C. Salvadó, Commented Oct 25, 2009 at 19:16

Christian C. Salvadó · Accepted Answer · 2009-10-25 18:57:16Z

21

You can also use the $.each function:

var obj = { one:1, two:2, three:3, four:4, five:5 };

$.each(obj, function(key, value) {
  //..
});

If you go for the for...in statement way, I would recommend you to check if the property resides directly on the object being iterated, because you could have some issues, if the Object.prototype is extended:

for(var key in obj) {
  if (obj.hasOwnProperty(key)){
    // value = obj[key];
  }
}

edited Oct 25, 2009 at 18:57

answered Oct 25, 2009 at 18:52

Christian C. Salvadó

831k185 gold badges929 silver badges845 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Zed · Accepted Answer · 2009-10-25 18:47:43Z

9

for (var key in json) {
  // ...
}

(this is standard javascript, not jQuery-speficic)

answered Oct 25, 2009 at 18:47

Zed

57.8k9 gold badges79 silver badges101 bronze badges

1 Comment

Uthman Over a year ago

This is correct but just like @CMS mentioned in his answer, always check if key is a property of json and not property of prototype, otherwise you can run into issues. Simply check if (json.hasOwnProperty(key) { //do stuff};.

Mike Gleason jr Couturier · Accepted Answer · 2009-10-25 18:52:25Z

2

In your case, this is not an array at all! You want to loop through properties of an object.

JavaScript does not truly support associative arays either... see http://www.hunlock.com/blogs/Mastering_Javascript_Arrays

Zed's answer is perfect, I would add

alert(json[key]);

inside the for, if you wonder how to get the value of the propery

Thanks

answered Oct 25, 2009 at 18:52

Mike Gleason jr Couturier

9,2064 gold badges44 silver badges60 bronze badges

Comments

amilaishere · Accepted Answer · 2014-12-03 07:37:50Z

0

You can access without each loop if you wanted.

var obj = JSON.parse(data);
var title  = obj[0].title;

answered Dec 3, 2014 at 7:37

amilaishere

4088 silver badges21 bronze badges

Comments

Giacomo1968 · Accepted Answer · 2015-11-21 03:57:23Z

var testObject = {
    "title": "What we do in our free time...",
    "link": "http://www.flickr.com/photos/tnhimmies/4042938515/",
    "media": {"m":"http://farm3.static.flickr.com/2572/4042938515_3a00561320_m.jpg"},
    "date_taken": "2009-10-24T03:48:10-08:00",
    "description": "<p><a href=\"http://www.flickr.com/people/tnhimmies/\">Darlene, TN Persians (www.tnpurrs.com)<\/a> posted a photo:<\/p> <p><a href=\"http://www.flickr.com/photos/tnhimmies/4042938515/\" title=\"What we do in our free time...\"><img src=\"http://farm3.static.flickr.com/2572/4042938515_3a00561320_m.jpg\" width=\"240\" height=\"230\" alt=\"What we do in our free time...\" /><\/a><\/p> <p>Tennessee Persians<br /> <a href=\"http://www.tnpurrs.com\" rel=\"nofollow\">www.tnpurrs.com<\/a><\/p>",
    "published": "2009-10-25T18:28:36Z",
    "author": "[email protected] (Darlene, TN Persians (www.tnpurrs.com))",
    "author_id": "66405213@N00",
    "tags": "cat persian tnpurrs"
};

if it is single object then you can access this by testObject.tags or testObject.title ... like this

or you can iterate by

$.each(obj,function(key,value){
///
});

Collectives™ on Stack Overflow

jQuery access JSON Object

5 Answers 5

Comments

1 Comment

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related