What is the difference between XMLHttpRequest, jQuery.ajax, jQuery.post, jQuery.get

Question

How can I find out which method is best for a situation? Can anybody provide some examples to know the difference in terms of functionality and performance?

Answer 1

• XMLHttpRequest is the raw browser object that jQuery wraps into a more usable and simplified form and cross browser consistent functionality.

• jQuery.ajax is a general Ajax requester in jQuery that can do any type and content requests.

• jQuery.get and jQuery.post on the other hand can only issue GET and POST requests. If you don't know what these are, you should check HTTP protocol and learn a little. Internally these two functions use jQuery.ajax but they use particular settings that you don't have to set yourself thus simplifying GET or POST request compared to using jQuery.ajax. GET and POST being the most used HTTP methods anyway (compared to DELETE, PUT, HEAD or even other seldom used exotics).

All jQuery functions use XMLHttpRequest object in the background, but provide additional functionality that you don't have to do yourself.

Usage

So if you're using jQuery I strongly recommend that you use jQuery functionality only. Forget about XMLHttpRequest altogether. Use suitable jQuery request function variations and in all other cases use $.ajax(). So don't forget there are other common jQuery Ajax related functions to $.get(), $.post() and $.ajax(). Well you can just use $.ajax() for all of your request, but you will have to write a little more code, because it needs a bit more options to call it.

Analogy

It's like you would be able to buy yourself a car engine that you'd have to create a whole car around it with steering, brakes etc... Car manufacturers produce completed cars, with a friendly interface (pedals, steering wheel etc.) so you don't have to do it all yourself.