Summary:
Ajax Learning 1 describes the use of jquery encapsulated Ajax to receive server-side text data and the use of Xmlhttpreques objects to receive server-side text data
Ajax Learning 2 describes the use of Xmlhttpreques to receive server-side XML data, and this section focuses on using Ajax in the Jqery package to receive server-side data in XML format.
Since a lot of knowledge has been done in detail, this section only describes the code needs to be modified, using the Jqery encapsulation of AJAX using XML format to receive server-side data, Web.xml, backstage Servet do not have to change,
Only the name of the method invoked in ajax.html is changed to the newly added JavaScript method.
One of the main methods used is introduction:
Jquery.ajax (options): Load remote Data via HTTP request,
return value: XMLHttpRequest
Parameters: Options (optional), Ajax request settings. All options are optional.
The main options are:
Type (String): (Default: "Get") Request method ("POST" or "get"), default to "get". Note: Other HTTP request methods, such as put and DELETE, are also available, but only some browsers support
URL (String): (Default: Current page address) Send the address of the request
Data (object,string): Sent to the server. is automatically converted to the request string format. The GET request is appended to the URL
DataType (String): The data type expected to be returned by the server.
If not specified, JQuery will automatically return Responsexml or responsetext based on the HTTP packet MIME information and pass as a callback function parameter, available values:
"XML": Returns an XML document that can be processed with jQuery.
HTML: Returns plain text HTML information, including script elements.
Script: Returns the plain text JavaScript code. Results are not automatically cached.
"JSON": Returns JSON data
Success (function): Callback functions after a successful request. Parameters: Server return data, data format
Error (Function): (Default: Automatic judgment (XML or HTML)) call time when a request fails
Async (Boolean): (Default: TRUE) by default, all requests are asynchronous requests.
If you need to send a sync request, set this option to false. Note that the synchronization request will lock the browser and other actions must wait for the request to complete before it can be executed
The new JavaScript method is as follows:
Copy Code code as follows:
<!--user name verification, using jquery encapsulated Ajax, receive XML-formatted response data-->
To load remote data through an HTTP request via the $.ajax () method
function Verifyjqueryxml () {
var jqueryobj= $ ("#username");
var username= jqueryobj.val ();
In JavaScript, a simple method of defining objects
var obj={name: "abc", AGE:20};
Encapsulation of Get requests for XMLHttpRequest objects using jquery
$.ajax ({
Type: "POST",//Request mode
URL: "Ajaxxmlserver",//server-side URL address
Data: "Name=" +username,//Sent to server-side
DataType: "xml",//telling jquery the data format returned
SUCCESS:CALLBACK1//The callback function that is invoked when the server returns the data correctly.
}); Note that URLs and datatype must correspond
}
function Callback1 (data) {
First you need to convert the DOM object into a jquery object
var jqueryobj=$ (data);
Get Message Node
var message=jqueryobj.children ();
Get text content
var text=message.text ();
Dynamically display server-side values on the page
var resultobj=$ ("#result");
resultobj.html (text);
}
From the above generation, the calling JavaScript method name in ajax.html should read: Verifyjqueryxml ()
