how to display json data using javascript

Question

i was trying to display values from a local json file but its not working.. here is my code

function loadJSON(callback) {
var xobj = new XMLHttpRequest();
xobj.overrideMimeType("application/json");
xobj.open('GET', 'json/headphones.json'); // Replace 'my_data' with the path to your file
xobj.onreadystatechange = function() {
    if (xobj.readyState == 4 && xobj.status == "200") {

      callback(xobj.responseText);
    }
 };
  xobj.send(null);
 }
  loadJSON(function(response) {
    // Parse JSON string into object
     actual_JSON = JSON.parse(response);

     console.log(JSON.stringify(actual_JSON));
       });

Answer 1

you are missing true in xobj.open('GET', 'json/headphones.json', true); line

see this

function loadJSON(callback) {
var xobj = new XMLHttpRequest();
xobj.overrideMimeType("application/json");
xobj.open('GET', 'json/headphones.json', true);
xobj.onreadystatechange = function() {
    if (xobj.readyState == 4 && xobj.status == "200") {
        callback(xobj.responseText);
    }
  };
    xobj.send(null);
  }
    loadJSON(function(response) {
   actual_JSON = JSON.parse(response);
    });