Summary of the use of get, post and ajax methods in jquery_jquery

In JQuery, you can use get, post and ajax methods to transfer data to the server

Usage of get method (customForGet.js file):

function verify(){
//1. Get the data of the text box

//Get it through DOM
//document.getElementByIdx("userName");
//Get it through JQuery
var jqueryObj = $("#userName");
//Get the value of the node
var userName = jqueryObj.val();

//2. Send the text box data to the server-side servlet
$.get("AJAXServer?name=" userName,null,callback);
}
//Callback function
function callback(data){

///3. Accept the data returned from the server
// alert(data);
//4. Display the data returned from the server on the page
//Get it for Node that displays result information
var resultObj = $("#result");
resultObj.html(data);
}

You can abbreviate the above file as:
function verify(){
$.get("AJAXServer?name=" $("#userName").val(),null,function callback(data ){$("#result").html(data);});
}

Usage of post method (customForPost.js):

function verify(){
//1. Get the data of the text box

//Get it through DOM
//document.getElementByIdx("userName");
//Get it through JQuery
var jqueryObj = $("#userName");
//Get the value of the node
var userName = jqueryObj.val();

//2. Send the text box data to the server-side servlet
// $.post("AJAXServer?name=" userName,null,callback);//You can also directly follow the parameters with post After the URL
$.post("AJAXServer",{name:userName,test:"test123"},callback);//When passing multiple parameters, separate them with commas. If the attribute value is a variable, write it directly. , such as: userName, if it is a character, add quotation marks, such as: "test123".
}
//Callback function
function callback(data){

///3. Accept the data returned from the server
// alert(data);
//4. Display the data returned from the server on the page
//Get it for Node that displays result information
var resultObj = $("#result");
resultObj.html(data);
}

You can abbreviate the above file as:
function verify(){
$.post("AJAXServer",{name:$("#userName").val(),test: "test123"},function(data){$("#result").html(data)});
}

Summary: In fact, the get and post methods are similar, as long as get and post are interchanged, and the storage location of the parameters can be used in both places;

For example:

$.post("AJAXServer",{name:$("#userName").val(),test:"test123"},function(data){$("#result").html(data) });

Just change post directly to get without modifying the position of the parameters, that is:

$.get("AJAXServer",{name:$("#userName").val(),test:"test123"},function(data){$("#result").html(data) });

The use of ajax method (customForAjaxText) receives data whose data type is plain text:

function verify(){
//1. Get the data of the text box
//Get it through JQuery
var jqueryObj = $("#userName");
//Get it The value of the node
var userName = jqueryObj.val();

//2. Send the text box data to the server-side servlet
$.ajax({
type:"POST",
url:"AJAXServer",
data:"name =" userName "&" "test=123",
success:function(data){
$("#result").html(data);
}
});
}

Use of ajax method (customForAjaxText) to receive data whose data type is XML:

function verify(){
//1. Get the data of the text box
//Get it through JQuery
var jqueryObj = $("#userName");
//Get it The value of the node
var userName = jqueryObj.val();

//2. Send the text box data to the server-side servlet
$.ajax({
type:"POST",
url:"AJAXXMLServer",
data:"name =" userName "&" "test=123",

dataType: "xml",
success:function(data){
//First you need to convert the passed DOM object into a jquery object
var jqueryObj = $(data);
//Get the message node
var messageNods = jqueryObj.children();
//Get the text content
var responseText = messageNods.text();
$("#result").html( responseText);
}
});
}