jQuery.get() | jQuery API Documentation (2024)

Categories: Ajax > Shorthand Methods

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

Description: Load data from the server using a HTTP GET request.

  • version added: 1.0jQuery.get( url [, data ] [, success ] [, dataType ] )

    • url

      Type: String

      A string containing the URL to which the request is sent.

    • data

      Type: PlainObject or String

      A plain object or string that is sent to the server with the request.

    • success

      Type: Function( PlainObject data, String textStatus, jqXHR jqXHR )

      A callback function that is executed if the request succeeds. Required if dataType is provided, but you can use null or jQuery.noop as a placeholder.

    • dataType

      Type: String

      The type of data expected from the server. Default: Intelligent Guess (xml, json, script, text, html).

  • version added: 1.12-and-2.2jQuery.get( [settings ] )

    • settings

      Type: PlainObject

      A set of key/value pairs that configure the Ajax request. All properties except for url are optional. A default can be set for any option with $.ajaxSetup(). See jQuery.ajax( settings ) for a complete list of all settings. The type option will automatically be set to GET.

This is a shorthand Ajax function, which is equivalent to:

1

2

3

4

5

6

$.ajax({

url: url,

data: data,

success: success,

dataType: dataType

});

The success callback function is passed the returned data, which will be an XML root element, text string, JavaScript file, or JSON object, depending on the MIME type of the response. It is also passed the text status of the response.

As of jQuery 1.5, the success callback function is also passed a "jqXHR" object (in jQuery 1.4, it was passed the XMLHttpRequest object). However, since JSONP and cross-domain GET requests do not use XHR, in those cases the jqXHR and textStatus parameters passed to the success callback are undefined.

Most implementations will specify a success handler:

1

2

3

4

$.get( "ajax/test.html", function( data ) {

$( ".result" ).html( data );

alert( "Load was performed." );

});

This example fetches the requested HTML snippet and inserts it on the page.

The jqXHR Object

As of jQuery 1.5, all of jQuery's Ajax methods return a superset of the XMLHTTPRequest object. This jQuery XHR object, or "jqXHR," returned by $.get() implements the Promise interface, giving it all the properties, methods, and behavior of a Promise (see Deferred object for more information). The jqXHR.done() (for success), jqXHR.fail() (for error), and jqXHR.always() (for completion, whether success or error; added in jQuery 1.6) methods take a function argument that is called when the request terminates. For information about the arguments this function receives, see the jqXHR Object section of the $.ajax() documentation.

The Promise interface also allows jQuery's Ajax methods, including $.get(), to chain multiple .done(), .fail(), and .always() callbacks on a single request, and even to assign these callbacks after the request may have completed. If the request is already complete, the callback is fired immediately.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

// Assign handlers immediately after making the request,

// and remember the jqxhr object for this request

var jqxhr = $.get( "example.php", function() {

alert( "success" );

})

.done(function() {

alert( "second success" );

})

.fail(function() {

alert( "error" );

})

.always(function() {

alert( "finished" );

});

// Perform other work here ...

// Set another completion function for the request above

jqxhr.always(function() {

alert( "second finished" );

});

Deprecation Notice

The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callback methods are removed as of jQuery 3.0. You can use jqXHR.done(), jqXHR.fail(), and jqXHR.always() instead.

Additional Notes:

  • Due to browser security restrictions, most "Ajax" requests are subject to the same origin policy; the request can not successfully retrieve data from a different domain, subdomain, port, or protocol.
  • If a request with jQuery.get() returns an error code, it will fail silently unless the script has also called the global ajaxError event. Alternatively, as of jQuery 1.5, the .error() method of the jqXHR object returned by jQuery.get() is also available for error handling.
  • Script and JSONP requests are not subject to the same origin policy restrictions.

Examples:

Request the test.php page, but ignore the return results.

1

$.get( "test.php" );

Request the test.php page and send some additional data along (while still ignoring the return results).

1

$.get( "test.php", { name: "John", time: "2pm" } );

Pass arrays of data to the server (while still ignoring the return results).

1

$.get( "test.php", { "choices[]": ["Jon", "Susan"] } );

Alert the results from requesting test.php (HTML or XML, depending on what was returned).

1

2

3

$.get( "test.php", function( data ) {

alert( "Data Loaded: " + data );

});

Alert the results from requesting test.cgi with an additional payload of data (HTML or XML, depending on what was returned).

1

2

3

4

$.get( "test.cgi", { name: "John", time: "2pm" } )

.done(function( data ) {

alert( "Data Loaded: " + data );

});

Get the test.php page contents, which has been returned in json format (<?php echo json_encode( array( "name"=>"John","time"=>"2pm" ) ); ?>), and add it to the page.

1

2

3

4

5

$.get( "test.php", function( data ) {

$( "body" )

.append( "Name: " + data.name ) // John

.append( "Time: " + data.time ); // 2pm

}, "json" );

Get another page on the same domain. Outputs to console both the data returned and the type of data returned.

1

2

3

4

5

6

// If this was sent on https://api.jquery.com/jQuery.get/ you will

// get the response result of https://api.jquery.com/jQuery.ajax/

$.get( "/jQuery.ajax/", function( data ) {

console.log( typeof data ); // string

console.log( data ); // HTML content of the jQuery.ajax page

});

jQuery.get() | jQuery API Documentation (2024)

FAQs

Is jQuery still relevant in 2024? ›

For sure! The JQuery library is still much loved and used by developers, thanks to various factors and streamlining attributes. The reason JQuery is relevant in 2024 is its ease of use.

What does get() do in jQuery? ›

In jQuery . get() method loads data from the server by using the GET HTTP request. This method returns XMLHttpRequest object. data : This is an optional parameter that represents key/value pairs that will be sent to the server.

Why is jQuery no longer used? ›

Jquery is no longer needed

Some developers argue that jQuery is no longer necessary in modern web development, as many of its features are now built into modern web browsers. They also point out that jQuery can add unnecessary overhead to web pages, and that its syntax can be verbose and difficult to read.

How to get data from API using jQuery? ›

jQuery. get( url [, data ] [, success ] [, dataType ] )Returns: jqXHR
  1. url. Type: String. A string containing the URL to which the request is sent.
  2. data. Type: PlainObject or String. ...
  3. success. Type: Function( PlainObject data, String textStatus, jqXHR jqXHR ) ...
  4. dataType. Type: String.

What is replacing jQuery? ›

Web Developers have a wealth of jQuery Alternatives, which include React, Vue. js, and Flux, among others. They offer component-based lightweight architectures.

Why is jQuery not recommended? ›

The reason why you should not use jQuery: Because it adds additional overhead to your web pages. You can do a lot of things with JavaScript which jQuery can probably make easy, but remember that including another file instead of writing 10 lines of JavaScript code is additional overhead to your web page.

What is the difference between jQuery get () and jQuery Ajax ()? ›

get() is a shortcut method that uses jQuery. ajax() under the hood, to create an Ajax request that is typical for simple retrieval of information.

How do you handle error in get request using jQuery? ›

As of jQuery 1.5, you can set an error handler after making an ajax request using $. get() via the jQuery XHR object, which allows you to chain the . error() callback after the request is complete. “This jQuery XHR object, or 'jqXHR,' returned by $.

What is the use of get () method? ›

The . get() method will return the value of a dictionary entry for a specified key. It may also specify a fallback value if the specified key does not exist in the dictionary.

Is jQuery still worth learning? ›

In conclusion, we realise that jQuery is being used less and less, especially by new developers, as a result of the updating of native JavaScript and the new technologies that are emerging. Despite this, learning jQuery remains important for those who need to work on older projects.

Why Bootstrap stopped using jQuery? ›

We've been focused on making the migration from v4 to v5 more approachable, but we've also not been afraid to step away from what's outdated or no longer appropriate. As such, we're very happy to say that with v5, Bootstrap no longer depends on jQuery and we've dropped support for Internet Explorer .

Why people are not using jQuery? ›

jQuery was made to bring helpers that works cross browser because before it was a mess when it came to javascript functions browser compatibility. It still is a mess now, but jQuery is not as useful as it was before because browser compatibility has improved a lot and there are now standards that browsers follow.

How do I pull all data from an API? ›

How to extract the API data
  1. Step 1: retrieve the API data URL.
  2. Step 2: create a new, blank Excel document.
  3. Step 3: paste the API data URL in the Excel document.
  4. Step 4: Enter the credentials.
  5. Step 5: load the API data in the Excel.
Oct 28, 2021

How to use an API to get data? ›

The typical steps involved in using an API are:
  1. Look for an API that will meet your needs.
  2. Understand the API terms for using.
  3. Read the API documentation so you can test the API.
  4. Request an API key.
  5. Using the API documentation to make an API request.
  6. Interpret the API response to see if it meets your needs.
Nov 30, 2023

How to post data to Web API using jQuery? ›

jQuery $.post() Method

The $.post() method requests data from the server using an HTTP POST request. Syntax: $.post(URL,data,callback); The required URL parameter specifies the URL you wish to request.

What is the future of jQuery? ›

Jquery and its Future

Jquery is a solid and well supported javascript library. With the invention of new javascript frameworks and libraries, it is difficult for jquery to return to its prominence, but jquery will still be used by developers.

Is AJAX still used in 2024? ›

Yes, people still use Ajax for web applications. If you have ever submitted a form on a modern website, chances are it uses Ajax in some capacity. Submitting a form does not require Ajax.

Is it still good to use jQuery? ›

It is still widely used in many legacy web applications and remains compatible with other frameworks like Bootstrap and Vue. js. Ultimately, it can be difficult to decide whether or not to use jQuery, as the choice of tools will depend on a developer's specific needs and goals.

Top Articles
Latest Posts
Article information

Author: Pres. Carey Rath

Last Updated:

Views: 5736

Rating: 4 / 5 (61 voted)

Reviews: 84% of readers found this page helpful

Author information

Name: Pres. Carey Rath

Birthday: 1997-03-06

Address: 14955 Ledner Trail, East Rodrickfort, NE 85127-8369

Phone: +18682428114917

Job: National Technology Representative

Hobby: Sand art, Drama, Web surfing, Cycling, Brazilian jiu-jitsu, Leather crafting, Creative writing

Introduction: My name is Pres. Carey Rath, I am a faithful, funny, vast, joyous, lively, brave, glamorous person who loves writing and wants to share my knowledge and understanding with you.