Detailed usage of $.get, $.post, $.getJSON and $.ajax in jQuery

The focus of this article is to talk about the four methods of calling ajax in jQuery: $.get, $.post, $getJSON, and $ajax. If the reader has no knowledge of javascript and jquery, or the concept of ajax, then please ask Du Niang before reading this article.
When we wrote ajax programs in javascript and were very "happy", suddenly someone told you that there is a thing called jquery, it will tell you how happy it is not to directly and HttpRequest, and you no longer need to worry about tangled ajax The garbled problem, the happier thing is that your js code will be greatly simplified. After reading this article, you will find that ajax is simply a sentence.

1.

The $.get $.get() method uses the GET method to make asynchronous requests. Its grammatical structure is:

$.get( url [, data] [, callback] )

Explain the parameters of this function:

url: string Type, the address of the ajax request.

data: optional parameter, object type, the key/value data sent to the server will be appended to the request URL as a QueryString.

callback: optional parameter, function type, the function is automatically called when ajax returns successfully.

Finally, write an example of $.get() for your reference:

$.get(
     "submit.aspx",{
         id:     '123',
         name: 'Ivy Garden',
     },function(data,state){
         //This displays the data returned from the server
         alert(data);
         //display the returned status here
         alert(state);
     }
 )
 

2. $.post()

The $.post() method uses the POST method to make asynchronous requests. Its syntax structure is:

$.post(url,[data],[callback],[type])

This method and $. The usage of get() is similar, except that there is one more type parameter, so only the type parameter is introduced here, and the others refer to $.get() above.

type: type is the requested data type, which can be html, xml, json, etc. If we set this parameter to: json, the returned format will be in json format. If not set, it will be returned with $.get() are in the same format as strings.

Finally, write an example of $.post() for your reference:

$.post(
     "submit.aspx",{
         id:     '123',
         name: 'Ivy Garden',
     },function(data,state){
         //This displays the data returned from the server
         alert(data);
         //display the returned status here
         alert(state);
     },
     "json"
 )

3. $.getJSON()

$.getJSON() is specially set up for ajax to obtain json data, and supports cross-domain calls. The format of its syntax is:

getJSON(url,[data],[callback])

url:string Type, sending request address data: optional parameter, Key/value parameter to be sent, same as get, post type data callback: optional parameter, callback function when loading is successful, same as get, post type callback

JSON is an ideal The data transfer format, it can be well integrated with JavaScript or other host languages, and can be used directly by JS. Compared with the traditional direct sending of "naked" data through GET and POST, using JSON is more reasonable in structure and safer. As for jQuery's getJSON() function, it's just a simplified version of the ajax() function that sets the JSON parameter. This function can also be used across domains, which has certain advantages over get() and post(). In addition, this function can let the program execute the callback function X by writing the request url in the format "myurl?callback=X".

4. $.ajax()

$.ajax() is a general ajax package in jquery. Its syntax is in the following format:

$.ajax(options)

where options is an object type, which indicates the specific parameters of this ajax call , here I attach the most commonly used parameters

$.ajax({
         url: 'submit.aspx',
         datatype: "json",
         type: 'post',
         success: function (e) { //Callback after success
             alert (e);
        },
         error: function(e){ //callback after failure
             alert (e);
         },
         beforeSend: function(){ / Called before sending the request, you can put some words like "loading"
             alert("Loading");
         }
 })
 

The above are several methods for jquery to implement ajax calls. Ajax calls are quite complicated. I hope this article can be helpful to you. If you have any questions, you can also contact me, and everyone can make progress together.