Understanding of several technologies involved in Ajax

Source: Internet
Author: User
1. XMLHttpRequest
One of the biggest features of AJAX is that data can be transmitted to or read/written to the server without refreshing the page. This feature is mainly due to the XMLHTTPRequest object of the XMLHTTP component. In this way, you can send a desktop application Program Exchange data only with the server, instead of refreshing the interface every time or submitting data processing to the server, in this way, the server load is reduced, the response speed is accelerated, and the user waiting time is shortened.
Microsoft was the first to apply XMLHTTP. IE (ie5 or above) allowed developers to use the XMLHTTP ActiveX component to expand their functions on the web page, developers can directly transfer data to the server or retrieve data from the server without having to navigate the current web page. This function is very important because it helps reduce the pain of stateless connections. It can also eliminate the need to download redundant HTML, thus improving the process speed. Mozilla (mozilla1.0 or later and netscape7 or later) responds by creating its own inherited XML proxy class: XMLHttpRequest class. Konqueror (similar to Safari v1.2 and khtml-based browsers) also supports XMLHttpRequest objects, while opera will also support XMLHttpRequest objects in Versions later than v7.6x +. In most cases, the XMLHTTPRequest object is similar to the XMLHTTP component, and the methods and attributes are similar, but a small part of the attributes are not supported.
Application of XMLHttpRequest: Application of XMLHttpRequest object in JS
VaR XMLHTTP = new XMLHttpRequest ();
Application of Microsoft 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 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 Description
Abort () Stop current request
GetAllResponseHeaders () Returns the complete headers as a string.
GetResponseHeader ("headerlabel ") Returns a single header tag as a string.
Open ("method", "url" [, asyncflag [, "username" [, "password"]) Set the target URL, method, and other parameters for pending requests
Send (content) Send request
SetRequestHeader ("label", "value ") Set the header and send it together with the request

XMLHTTPRequest object attributes

Attribute Description
Onreadystatechange Event triggers with status changes
Readystate Object status (integer ):
0 = not initialized
1 = reading
2 = read
3 = interaction in progress
4 = complete
Responsetext The text version of the data returned by the server process
Responsexml XML document objects compatible with Dom returned by Server Processes
Status Status Code returned by the server, for example, 404 = "found at the end of the file", 200 = "successful"
Statustext Status text returned by the server

2. Javascript
Javascript is widely used in browsers. Programming Language , He used to be devalued as a bad language (he is really boring ), it is often used for show-off gadgets, pranks, or monotonous form verification. But the fact is that he is a real programming language, has its own standards and is widely supported in various browsers.
3. Dom
Document Object Model.
Dom is a set of APIS for HTML and XML files. It provides the structure of the file, allowing you to change the content and visible objects. In essence, it is a bridge between web pages and scripts or programming languages.
All the attributes, methods, and events that web developers can operate and create files are displayed as objects. For example, document represents the object, table objects represent HTML table objects ). These objects can be used as scripts by most browsers today.
A webpage built with HTML or XHTML can also be seen as a group of structured data, which is blocked in the DOM (Document Object Model, dom supports reading and writing of objects in a webpage.
4. xml
The Extensible Markup Language (Extensible Markup Language) has an open, scalable, and self-descriptive language structure that has become the standard for online data and document transmission. It is a language used to describe the data structure, just like its name. He makes it easier to define some structured data and can exchange data with other applications.
5. Comprehensive
The Ajax engine mentioned by Jesse James Garret is actually a complicated JavaScript Application that processes user requests, reads and writes servers, and changes Dom content.
The Ajax engine of JavaScript reads information and interactively overwrites the Dom, which enables the webpage to be modularized and restructured, that is, after the page has been downloaded, the page content is changed, this is a method that we have been using JavaScript and Dom extensively. However, to make webpages truly dynamic, not only internal interaction, but also external data needs to be obtained. In the past, we allow users to input data and Change Webpage content through DOM. But now, XMLHttpRequest allows us to read and write data on the server without reloading the page, minimize user input.
XML-based network communication is not a new thing. In fact, flash and Java Applet both have a good performance. Now this rich interaction is available on the web page, it is based on standardized and widely supported technologies, and does not require plug-ins or downloading applets.
Ajax is a transformation of traditional Web applications. Previously, the server generated HTML pages each time and returned them to the client (browser ). In most websites, at least 90% of the pages are the same, such as the structure, format, header, footer, and advertisement. The difference is only a small part of the content, but every time the server generates all the pages and returns them to the client, this is an invisible waste, whether it is for the user's time, bandwidth, CPU consumption, for ISP bandwidth and space rented at high prices. If you calculate by one page, only a few K or dozens of K may be inconspicuous, but for example, a large ISP that generates millions of pages every day in Sina, it can be said that the loss is huge. AJAX can process client requests as the middle layer of the client and server, and send requests to the server as needed, there will be no data redundancy or waste, reducing the total amount of data downloads. In addition, you do not need to reload all the content when updating the page, just update the part that needs to be updated, compared with the pure background processing and reload method, this method shortens the user wait time and minimizes the waste of resources. Based on standardized and widely supported technologies, there is no need for plug-ins or downloading small programs, so Ajax is double-profit for users and ISPs.
Ajax separates web interfaces from applications (data and presentation). In the past, there were no clear boundaries between the two. Data and presentation were separated, it is conducive to the division of labor and cooperation, reduces web application errors caused by non-technical staff modification, improves efficiency, and is more suitable for the current release system. You can also transfer the previous server workload to the client, which facilitates the idle processing capability of the client.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.