jQuery get() Method

What You’ll Learn

$.get() is jQuery’s readable GET shorthand. This tutorial covers both official signatures, how it maps to $.ajax(), the success callback arguments, parsing JSON with the fourth dataType argument, chaining .done(), .fail(), and .always() on the returned jqXHR, the settings-object form since jQuery 1.12, silent error behavior, and when to upgrade to full $.ajax().

Introduction

Most pages need to load data from a server — a user profile, a list of posts, an HTML fragment for a sidebar. jQuery makes that one line with $.get(). Pass a URL and a callback; jQuery sends an asynchronous HTTP GET request and invokes your function when the server responds successfully.

Under the hood, $.get() is not a separate transport — it is a thin wrapper around jQuery.ajax() with type: "GET" preset. That means you inherit the same jqXHR return value, global Ajax events on document, and Promise-style chaining. When your needs outgrow a one-liner — custom headers, POST bodies, or global: false — you drop down to $.ajax() without changing mental models.

Understanding jQuery.get()

jQuery.get() loads data from a server using an HTTP GET request. The method returns immediately with a jqXHR object while the network call runs in the background. If you pass a success function, jQuery calls it with the response body once parsing completes — the exact type depends on the optional dataType argument or jQuery’s intelligent guess from the Content-Type header.

The optional data argument is a plain object (or string) appended to the URL as query parameters — ideal for search terms, page numbers, or filter flags. Because GET requests should be idempotent reads, keep writes and sensitive payloads on $.post() or full $.ajax() with method: "POST".

📝 Syntax

The official jQuery API accepts two signatures:

1. Positional arguments — jQuery.get( url [, data ] [, success ] [, dataType ] )

jQuery.get( url [, data ] [, success ] [, dataType ] )

The classic form — URL first, optional query data, optional success callback, optional expected response type.

2. Settings object — jQuery.get( [ settings ] ) (since jQuery 1.12)

jQuery.get( [ settings ] )

Pass a single settings object. All $.ajax() options except url are optional; jQuery sets type to "GET" automatically.

Equivalence to $.ajax()

These two calls are identical:

// Shorthand
$.get( url, data, success, dataType );

// Expanded — what jQuery does internally
$.ajax( {
  url: url,
  data: data,
  success: success,
  dataType: dataType,
  type: "GET"
} );

success callback signature

• data — parsed response: XML root, string, script, or JSON object depending on dataType and MIME type.
• textStatus — string such as "success"; may be undefined for JSONP/cross-domain GET without XHR.
• jqXHR — the same jqXHR object returned by $.get(); also undefined for some JSONP requests.

Return value

• $.get() returns a jqXHR object — chain .done(), .fail(), and .always().
• Handlers can be attached after the request completes; jQuery fires them immediately if already finished.
• Deprecated jqXHR methods .success(), .error(), and .complete() were removed in jQuery 3.0 — use .done() / .fail() / .always().
• Call jqXHR.abort() to cancel an in-flight GET request.

Examples Gallery

Five progressive examples from a basic GET with a success callback through query parameters, explicit dataType: "json", jqXHR chaining, and the settings-object signature. Each links to a Try-it lab where you can edit and run the code in the browser.

$( "#load" ).on( "click", function() {
  $.get(
    "https://jsonplaceholder.typicode.com/posts/1",
    function( data ) {
      $( "#result" ).text( "Title: " + data.title );
    }
  );
} );

User clicks #load → $.get() sends GET /posts/1

Server returns JSON → success callback runs → #result shows "Title: ..."

Network or server error → success never runs (silent unless .fail() chained)

$( "#search" ).on( "click", function() {
  var userId = $( "#user-id" ).val() || 1;

  $.get(
    "https://jsonplaceholder.typicode.com/posts",
    { userId: userId },
    function( posts ) {
      var count = posts.length;
      $( "#result" ).text( "Found " + count + " posts for user " + userId );
    }
  );
} );

userId = 1 → GET /posts?userId=1

success receives JSON array → #result shows "Found 10 posts for user 1"

Change #user-id → query string updates automatically

function showUser( userId ) {
  $.get(
    "https://jsonplaceholder.typicode.com/users/" + userId,
    null,
    function( user ) {
      $( "#name" ).text( user.name );
      $( "#email" ).text( user.email );
      console.log( typeof user ); // "object"
    },
    "json"
  );
}

showUser( 1 );

GET /users/1 with dataType "json"

success receives parsed object → #name and #email populated

Invalid JSON would fail silently unless .fail() is chained

function loadComments( postId ) {
  return $.get( "https://jsonplaceholder.typicode.com/posts/" + postId + "/comments" )
    .done( function( comments, textStatus, jqXHR ) {
      var html = comments.map( function( c ) {
        return "<li>" + c.email + ": " + c.body.substring( 0, 40 ) + "...</li>";
      } ).join( "" );
      $( "#list" ).html( html );
      console.log( "Status:", textStatus, "HTTP:", jqXHR.status );
    } )
    .fail( function( jqXHR, textStatus, errorThrown ) {
      $( "#list" ).html( "<li>Could not load comments (" + textStatus + ")</li>" );
    } )
    .always( function() {
      $( "#spinner" ).hide();
    } );
}

loadComments( 1 );

Valid postId → .done() builds comment list in #list

404 or network error → .fail() shows error message

Either outcome → .always() hides #spinner

$( "#load-album" ).on( "click", function() {
  $.get( {
    url: "https://jsonplaceholder.typicode.com/albums/1",
    dataType: "json",
    cache: false
  } )
    .done( function( album ) {
      $( "#title" ).text( album.title );
      $( "#id" ).text( "Album #" + album.id + " (user " + album.userId + ")" );
    } )
    .fail( function() {
      $( "#title" ).text( "Album not found." );
    } );
} );

Click #load-album → GET /albums/1 with dataType json

.done() fills #title and #id with parsed album fields

cache: false adds _=timestamp to avoid stale GET cache

🚀 Common Use Cases

• Load JSON records — fetch a user, post, or product by ID and render fields in the DOM.
• Filtered lists — pass search terms and pagination as the data query object.
• HTML partials — retrieve server-rendered fragments and inject with .html() (omit dataType or set "html").
• Autocomplete — debounced GET as the user types; abort the previous jqXHR on each keystroke.
• Polling / refresh — periodic $.get() to update a dashboard widget without reloading the page.
• Prefetch — fire-and-forget GET to warm a cache before the user clicks (chain .done() to store results locally).

📝 Notes

• $.get() is asynchronous — code after the call runs before the response arrives.
• It is shorthand for $.ajax() with type: "GET" — same jqXHR, same global Ajax events.
• Silent failure: HTTP errors fail quietly unless you chain .fail() or register a global ajaxError handler.
• Same-origin policy: cross-domain GET requests require CORS headers on the server; otherwise the browser blocks the response.
• JSONP and script: script and JSONP requests bypass same-origin restrictions but do not use XHR — jqXHR in success may be undefined.
• Prefer .done() / .fail() / .always() over deprecated jqXHR .success() / .error() / .complete() (removed in jQuery 3.0).
• When skipping data but providing dataType in the positional form, pass null as the second argument (jQuery 3.x).
• The settings-object form $.get({ ... }) is available since jQuery 1.12 — it sets type to GET automatically.

💡 Best Practices