Question

I have found this information on the web about jquery ajax requests.

load(): Load a piece of html into a container DOM.

$.getJSON(): Load a JSON with GET method.

$.getScript(): Load a JavaScript.

$.get(): Use this if you want to make a GET call and play extensively with the response.

$.post(): Use this if you want to make a POST call and don’t want to load the response to some container DOM.

$.ajax(): Use this if you need to do something when XHR fails, or you need to specify ajax options (e.g. cache: true) on the fly.

But it doesn’t say anything about performance which is best for using it for what. Which is best for from validation? Which is best in speed and such alike.

I have never used jQuery ajax before and wondered from some of you more experienced programmers in your time of using jQuery ajax requests which have your find suit your needs best?

What is JSON I know it is called javascript object notation but what does mean?

Answer 1

Like kingjiv said, each and every one of those go through the $.ajax method.

load() sets the type to get/post does other things in the background to make sure that the response is populated on the selected element then calls $.ajax. Below is the code.

load: function( url, params, callback ) {
    if ( typeof url !== "string" && _load ) {
        return _load.apply( this, arguments );

    // Don't do a request if no elements are being requested
    } else if ( !this.length ) {
        return this;
    }

    var off = url.indexOf( " " );
    if ( off >= 0 ) {
        var selector = url.slice( off, url.length );
        url = url.slice( 0, off );
    }

    // Default to a GET request
    var type = "GET";

    // If the second parameter was provided
    if ( params ) {
        // If it's a function
        if ( jQuery.isFunction( params ) ) {
            // We assume that it's the callback
            callback = params;
            params = undefined;

        // Otherwise, build a param string
        } else if ( typeof params === "object" ) {
            params = jQuery.param( params, jQuery.ajaxSettings.traditional );
            type = "POST";
        }
    } // after this is calls $.ajax and passes in the parameters 

---

$.getJSON(): This just calls $.get setting the dataType to json. $.get in turn calls $.ajax

getJSON: function( url, data, callback ) {
        return jQuery.get( url, data, callback, "json" );
    }

---

$.getScript(): You guessed it, just calls $.get and passes in the dataType as script.

getScript: function( url, callback ) {
        return jQuery.get( url, undefined, callback, "script" );
    },

---

$.get() & $.post(): These two methods call $.ajax as well.

jQuery.each( [ "get", "post" ], function( i, method ) {
    jQuery[ method ] = function( url, data, callback, type ) {
        // shift arguments if data argument was omitted
        if ( jQuery.isFunction( data ) ) {
            type = type || callback;
            callback = data;
            data = undefined;
        }

        return jQuery.ajax({
            type: method,
            url: url,
            data: data,
            success: callback,
            dataType: type
        });
    };
});

In conclusion, use whatever is suited to the purpose, just depends on what you intend to do. The performance should be the same since you have seen they all go through $.ajax