Ajax Technical Documentation (1)

Ajax

First, the main reason to use Ajax

1, through the appropriate AJAX application to achieve a better user experience;

2, some of the previous server burden to the client, to facilitate the client idle processing capacity to deal with, reduce the burden of server and bandwidth, so as to save the ISP space and bandwidth rental costs.

Second, the reference

Ajax This concept of the earliest proposed by Jesse James Garrett that:

Ajax is the abbreviation for asynchronous JavaScript and XML. Ajax is not a new language or technology, it is actually a combination of several technologies in a certain way to play their role in the same collaboration, it includes:

Standardized rendering using XHTML and CSS;

Use DOM to implement dynamic display and interaction;

Data exchange and processing using XML and XSLT;

Using XMLHttpRequest for asynchronous data reading;

Finally, bind and process all data with JavaScript;

Ajax works by adding a middle tier between the user and the server, enabling the user to respond asynchronously to the server. Not all user requests are submitted to the server, such as data validation and processing, which are given to the Ajax engine itself, and the Ajax engine submits the request to the server only if it is determined that the new data needs to be read from the server.

Figure 2-1

Figure 2-2

Iii. Overview

Although Garrent lists 7 Ajax components, it is personally believed that the so-called Ajax core is JavaScript, XMLHttpRequest, and Dom, and that if the data format is XML, it can be added with XML ( Ajax data returned from the server can be in XML format or in other formats, such as text.

In the old interaction, the user triggers an HTTP request to the server, the server processes it, returns a new HTHL page to the client, and every time the server processes a client-submitted request, the client can only wait, and even if it is only a small interaction, By simply getting a very simple piece of data from the server, you return a full HTML page, and the user wastes time and bandwidth each time to reread the entire page.

With Ajax, the user will quickly respond to a wait without a page overload (screen) from almost every operation it feels.

1, XMLHttpRequest

One of the biggest features of Ajax is the fact that you can transfer or read or write data to the server without refreshing the page (also known as no Refresh Update page), which is mainly thanks to the XMLHTTP component XMLHttpRequest object. This can be sent to the desktop application only with the server data level exchange, and do not refresh the interface every time without each time the data processing to the server to do, which is to reduce the burden of the server and accelerate the response speed, shorten the user waiting time.

The first applications xmlhttp Microsoft, IE (IE5), by allowing developers to extend their functionality within a Web page using XMLHTTP ActiveX components, developers can transfer data directly to or from the server without navigating from the current Web page. This feature is important because it helps to reduce the pain of stateless connections, and it also eliminates the need to download redundant HTML, thereby increasing the speed of the process. The response of Mozilla (Mozilla1.0 above and above NetScape7) is to create its own inherited XML proxy class: the XMLHttpRequest class. Konqueror (and Safari v1.2, also a khtml based browser) also supports XMLHttpRequest objects, and opera also supports v7.6x+ objects in later versions of XMLHttpRequest. For most cases, XMLHttpRequest objects are similar to XMLHTTP components, and methods and properties are similar, except that a small subset of properties are not supported.

Application of XMLHttpRequest:

The application of XMLHttpRequest object in JS

var xmlhttp = new XMLHttpRequest ();

The application of Microsoft's XMLHTTP component in JS

var xmlhttp = new ActiveXObject (microsoft.xmlhttp);

var xmlhttp = new ActiveXObject (msxml2.xmlhttp);

XMLHttpRequest Object method

/**

* Cross-browser XMLHttpRequest instantiation.

*/

if (typeof XMLHttpRequest = = "undefined") {

XMLHttpRequest = function () {

var msxmls = ["MSXML3", "MSXML2", "Microsoft"]

for (Var i=0 i < msxmls.length; i++) {

try {

Return to new ActiveXObject (msxmls[i]+). XMLHTTP ")

catch (e) {}

}

throw new Error ("No XML component installed!")

}

}

function Createxmlhttprequest () {

try {

Attempt to create it "the Mozilla Way"

if (window. XMLHttpRequest) {

return new XMLHttpRequest ();

}

Guess Not-now the IE Way

if (window. ActiveXObject) {

return new ActiveXObject (Getxmlprefix () + ". XmlHttp ");

}

}

catch (ex) {}

return false;

};

XMLHttpRequest Object method

Method	Describe
Abort ()	Stop current request
getAllResponseHeaders ()	Return the complete headers as a string
getResponseHeader ("Headerlabel")	To ask a single header label as a string
Open ("Method", "URL" [, asyncflag[, "UserName" [, "Password"]])	Set the target URL, method, and other parameters of pending requests
Send (content)	Send Request
setRequestHeader ("label", "value")	Set header and send along with request

[1] [2] Next page