Skip to content
Related Articles
Open in App
Not now

Related Articles

jQuery getJSON() Method

Improve Article
Save Article
  • Difficulty Level : Basic
  • Last Updated : 24 Nov, 2021
Improve Article
Save Article

In this article, we will learn about the getJSON() method in jQuery, along with understanding their implementation through the example. jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, It is widely famous for its philosophy of “Write less, do more”

The getJSON() method in jQuery fetches JSON-encoded data from the server using a GET HTTP request.



Parameters: This method accepts three parameters as mentioned above and described below:

  • url: It is a required parameter. It is used to specify the URL in the form of a string to which the request is sent
  • data: It is an optional parameter that specifies data that will be sent to the server.
  • callback: It is also an optional parameter that runs when the request succeeds.

Return Value: It returns XMLHttpRequest object.

Please refer to the jQuery Tutorial and jQuery Examples articles for further details.

Example: The below example illustrates the getJSON() method in jQuery.

employee.json file:

“name”: “Tony Stark”, 
“age” : “53”, 
“role”: “Techincal content writer”, 
“company”:”Geeks for Geeks” 

Here, we get the JSON file and displays its content.


<!DOCTYPE html>
    <title>jQuery getJSON() Method</title>
    <script src=
    <!-- Script to get JSON file and display its content -->
    <script type="text/javascript" language="javascript">
    $(document).ready(function() {
        $("#fetch").click(function(event) {
            $.getJSON('employee.json', function(emp) {
                $('#display').html('<p> Name: ' + + '</p>');
                $('#display').append('<p>Age : ' + emp.age + '</p>');
                $('#display').append('<p> Role: ' + emp.role + '</p>');
                $('#display').append('<p> Company: '
                + '</p>');
<p> Click on the button to fetch employee data </p>
    <div id="display" style="background-color:#39B54A;"></div>
    <input type="button" id="fetch" value="Fetch Employee Data" /> </body>


 getJSON() Method

My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!