How to Read a JSON file with jQuery

To read a JSON file with jQuery, use the getJSON() method. Let's have a look at the syntax of this method before writing an example to get JSON content from a file and use it in a program.


The getJSON() Syntax

getJSON() accepts three parameters; the first is required and the last two are optional.


jQuery.getJSON( url [, data ] [, success ] )


  • url - The path to the location of the JSON file.
  • data - Data from the file; a function can be used here to do something with the JSON content.
  • success - a callback function that is used if the request was successful.


Read a JSON File and use the Data

The example code below demonstrates how to open a JSON file, loop through the data and read the value of an object property with jQuery.


  { "country": "Afghanistan", "code": "93" },
  { "country": "Albania", "code": "355" },
  { "country": "Algeria", "code": "213" },
  { "country": "American Samoa", "code": "1" }
var filePath = '/js/country_codes.json';

$.getJSON(filePath, function( data ) {
  $.each( data, function( key, val ) {