Parse json tree structure

Question

I'm trying to output all elements of this json :

{"nodes":[{"url":"asdfas","date":""},{"url":"asdfas","date":""},{"url":"asdfasfdasas","date":""}]}

Here is the code I have so far, but nothing is being outputted.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
  <script type="text/javascript">

var arr = "{\"nodes\":[{\"url\":\"asdfas\",\"date\":\"\"},{\"url\":\"asdfas\",\"date\":\"\"},{\"url\":\"asdfasfdasas\",\"date"\:\"\"}]}";

for(var i=0;i<arr.length;i++){
    var obj = arr[i];
    for(var key in obj){
        var attrName = key;
        var attrValue = obj[key];
        $('body').append(attrName);
    }
}

</script>

<body>
</body>

EDIT:

Here is my updated file but still no output ? :

<!DOCTYPE html>
<html>
<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
  <script type="text/javascript">

//Or you can parse it from a string
  var arr = JSON.parse('{\"nodes\":[{\"url\":\"asdfas\",\"date\":\"\"},{\"url\":\"asdfas\",\"date\":\"\"},{\"url\":\"asdfasfdasas\",\"date"\:\"\"}]}');

  // You have to iterate over arr.nodes, not arr
  for(var i=0;i<arr.nodes.length;i++){
      var obj = arr.nodes[i];
      for(var key in obj){
          var attrName = key;
          var attrValue = obj[key];
          $('body').append(attrName);
      }
  }

</script>
</head>

<body>




</body>
</html>

arr is a string, obj is a character (but at least in Chrome I get some output, key is 0, format and truncate). You have to parse the JSON first (or simply create an array of objects instead, depending on your actual use case). — Felix Kling
– Felix Kling, Commented Feb 28, 2012 at 22:29
arr is just a string, replace arr with the example code you have at the top of your post — anson
– anson, Commented Feb 28, 2012 at 22:30

Ruan Mendes · Accepted Answer · 2012-02-29 21:49:11Z

2

your JSON needs to be parsed or not put into a string;

// arr is a bad name, it is not an array, it's an object
// JSON is valid JavaScript
var arr = {"nodes":[{"url":"asdfas","date":""},{"url":"asdfas","date":""},{"url":"asdfasfdasas","date":""}]};

// Or you can parse it from a string
var arr = JSON.parse("{\"nodes\":[{\"url\":\"asdfas\",\"date\":\"\"},{\"url\":\"asdfas\",\"date\":\"\"},{\"url\":\"asdfasfdasas\",\"date\":\"\"}]}");

// You have to iterate over arr.nodes, not arr
for(var i=0;i<arr.nodes.length;i++){
    var obj = arr.nodes[i];
    for(var key in obj){
        var attrName = key;
        var attrValue = obj[key];
        $('body').append(attrName);
    }
}

edited Feb 29, 2012 at 21:49

answered Feb 28, 2012 at 22:32

Ruan Mendes

92.7k31 gold badges161 silver badges225 bronze badges

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

3 Comments

Roko C. Buljan Over a year ago

+1 jsbin.com/evavuc/edit#javascript,html,live fixed line:

var arr = JSON.parse('{\"nodes\":[{\"url\":\"asdfas\",\"date\":\""},{\"url\":\"asdfas\",\"date\":\""},{\"url\":\"asdfasfdasas\",\"date"\:\""}]}');

Ruan Mendes Over a year ago

@user470184: Did you see the link that roXon put up here? That shows that the above code does work. Your error is that your JSON is malformed, at the end of your JSON string, \"date"\:\"\"}]} should be \"date\":\"\"}]}. See the problem? You should have also seen that the problem was badly formatted JSON from the console. Be sure to always check the console output. Last thing, you don't need to escape your double quotes if you encase your string in single quotes as you have. That would have helped you see the problem. You shouldn't ever generate JSON by hand anyway.

Ruan Mendes Over a year ago

@roXon: Thanks, what you mentioned was the last step to get user470184's problems fixed.

blue-sky · Accepted Answer · 2012-03-01 09:01:36Z

0

This works for me (tested on chrome). I needed to use the .ready function :

<!DOCTYPE html>
<html>
<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
  <script>
  $(document).ready(function () { 
//Or you can parse it from a string
  var arr = JSON.parse('{\"nodes\":[{\"url\":\"asdfas\",\"date\":\"\"},{\"url\":\"asdfas\",\"date\":\"\"},{\"url\":\"asdfasfdasas\",\"date\":\"\"}]}');

  // You have to iterate over arr.nodes, not arr
  for(var i=0;i<arr.nodes.length;i++){
      var obj = arr.nodes[i];
      for(var key in obj){
          var attrName = key;
          var attrValue = obj[key];
          $('body').append(attrName);
      }
  }

  });

</script>
</head>

<body>




</body>
</html>

edited Mar 1, 2012 at 9:01

answered Feb 28, 2012 at 23:34

blue-sky

54.3k161 gold badges470 silver badges787 bronze badges

2 Comments

Ruan Mendes Over a year ago

Doesn't work, still not valid json. Quote after the last date property is before the slash.

blue-sky Over a year ago

I've updated the answer, should be ok now. Above code did work for me in chrome.

Collectives™ on Stack Overflow

Parse json tree structure

2 Answers 2

3 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related