Understanding, creation, and application of Ajax technology

Ajax comprehension:
1. ajax is a mechanism between the client and the server, but this mechanism is on the front-end. It uses the idle functions of the front-end to exchange data between the front-end and the back-end, in order to enhance user health check, reduce server pressure, and more effectively use bandwidth.
2. Ajax adopts the Asynchronous interaction mechanism.
3. Ajax is used for partial page refreshing to verify and retrieve data as needed.
4. The disadvantage of AJAX is that it is difficult for browsers to be compatible, and it is not ideal for Ajax support on embedded mobile terminals.

5. Ajax is already a necessary technology for web development, and its advantages are far greater than its disadvantages.

6. Ajax involves 7 main technologies, including JavaScript, XMLHttpRequest, Dom, and XML.

7. XMLHTTPRequest object

XMLHttpRequest is the object of the XMLHTTP component. Through this object, AJAX can be like a desktop application.

In the same way, data is exchanged only with the server, instead of refreshing the interface every time, or

All the work is done by the server. This not only reduces the burden on the server, but also accelerates the response speed and shortens the use

The waiting time of the user.

Javascript

Javascript has been positioned as the script language of the client. The most widely used field is form data validation. Now

You can use JavaScript to operate XMLHttpRequest to deal with databases.

Dom

Dom (Document Object Model) is a set of APIS for HTML and XML.

It can be used to change the content and visible objects. The script language can follow the page through DOM

Row interaction. Web developers can operate and create file attributes, methods, and events in an object. For example,

Document indicates the page object itself.

XML

With XML (Extensible Markup Language), you can standardize the definition of structured data, which is transmitted online.

Data and documents comply with unified standards. Data and documents expressed in XML can be easily shared by all programs.
　

Create Ajax:
Compatibility considerations:

1. Browsers are divided into IE and non-ie, where non-ie follows W3C standards and the Creation method is basically the same, while IE is different, and the method of creating each version is also different.

2. Create Ajax

</PRE> <PRE name = "code" class = "php"> <SCRIPT> function createajax () {var request = false; // XMLHttpRequest in the window object is non-ie, including (IE7, IE8) if (window. XMLHttpRequest) {request = new XMLHttpRequest (); Some browsers need to overwrite emimetypeif (request. overridemimetype) {request. overridemimetype ("text/XML"); // specify the text type} // The activexobject attribute in the window object exists as IE} else if (window. activexobject) {// put the browser parameters of each version of IE in an array var versions = ['Microsoft. XMLHTTP ', 'msxml. XMLHTTP ', 'msxml2. xmlhttp.7.0 ', 'msxml2. xmlhttp.6.0 ', 'msxml2. xmlhttp.5.0 ', 'msxml2. xmlhtt4.0 ', 'msxml2. xmlhttp.3.0 ', 'msxml2. XMLHTTP ']; // traverse the array, determine the version, and create the corresponding Ajax for (VAR I = 0; I <versions. length; I ++) {try {request = new activexobject (versions [I]); If (request) {return request ;}} catch (E) {request = false ;}}return request;} var Ajax = createajax (); // Create Ajax alert (Ajax); test </SCRIPT>

 

Methods and attributes of Ajax objects

1. attributes of the XMLHTTPRequest object:

Onreadystatechange event trigger
Readystate object status (integer ):
0 = not initialized 1 = reading 2 = read 3 = interaction 4 = completed
The text version of the data returned by the responsetext server process
Responsexml: XML Document Object compatible with Dom returned by the server process
Status Code returned by the Status server, such as: 404 = "file not found", 200 = "successful"
Status text returned by the statustext Server

2. XMLHTTPRequest object method:

Abort () stops the current request
GetAllResponseHeaders () returns the complete headers as a string.
GetResponseHeader ("headerlabel") returns a single header label as a string
Open ("method", "url" [, asyncflag [, "username" [, "password"]) sets the target URL, method, and other parameters of a pending request.
Send (content) Send request
SetRequestHeader ("label", "value") sets the header and sends it together with the request