Ajax usage summary and Ajax usage Summary

Ajax usage summary and Ajax usage Summary

I. What is Ajax?

Ajax is called "Asynchr JavsScript and XML" (Asynchronous JavaScript and XML) in English. It is a development technology for creating interactive web pages.

Ii. Core of Ajax technology

Ajax is the integration of a series of related technologies. Its core technologies include XMLHttpRequest, JavsScript, and DOM. Json or XML technologies may be used for different data formats.

XMLHttpRequest is its core content. It can provide a specific communication mode for JavaScript scripts on the page, so that the page javascript script and the server form a dynamic interaction effect, the biggest advantage of XMLHTTPRequest is that javascript scripts in the page can directly interact with the server without refreshing the page, so as to achieve the effect of refreshing the page.

3. XMLHttpRequest method attribute description

1. Method description

Abort () stops the current request

GetAllResponseHeaders () returns all HTTP Request Response Headers as key/value pairs.

GetResponseHeader ("header") returns the string value of the specified header.

Open ("method", "URL", [asyncFlag], ["userName"], ["password"]) creates a call to the server. The method parameter can be GET, POST, or PUT.

Url parameters can be relative URLs or absolute URLs. This method also includes three optional parameters: asynchronous or not, user name, and password.

Send (content) sends a request to the server

SetRequestHeader ("header", "value") sets the specified header to the provided value. You must call open () before setting any header ().

Set the header and send it together with the request (the 'post' method is required)

XMLHttpRequest object attribute description

2. Method description

An event trigger that changes the onreadystatechange status. This event processor is triggered when each state changes. Generally, a JavaScript function is called.

The status of the readyState request. Five optional values: 0 = not initialized, 1 = loading, 2 = loaded, 3 = interaction, 4 = completed

Response of the responseText server, which returns the text of the data.

Response from the responseXML server returns a DOM-compatible XML Document Object. This object can be parsed as a DOM object.

Subject returned by the responseBody server (in non-text format)

Data Streams returned by the responseStream Server

Status Server HTTP status Code (for example, 404 = "found at the end of the file", 200 = "successful", etc)

Status text returned by the statusText server, corresponding HTTP status code text (OK or Not Found (Not Found), and so on)

Iv. Working Principles of Ajax

The working principle of AJAX is equivalent to adding an intermediate layer between the user and the server, so that user operations are asynchronous with the server. Not all user requests

All of them are submitted to the server, for example, some data verification and data processing are handed over to the AJAX engine. Only when it is determined that new data needs to be read from the server

The AJAX engine submits requests to the server.

V. Advantages of Ajax

1. reduces the burden on the server and improves the website performance.

2. The page is refreshed, reducing the time users wait for loading the website.

3. the user experience is more friendly, and the white screen can be avoided.

4. Ajax is based on standardized and widely used technologies. Almost all mainstream browsers support this technology. ye does not need to install plug-ins separately.

5. Ajax can separate pages and applications on the Web to facilitate division of labor and cooperation.

6. Ajax disadvantages

1. Mobile devices cannot be well supported.

2. Ajax kills the back button, which destroys the browser's back-up mechanism.

3. Security Issues. For example, cross-site attacks, SQL injection attacks, and credentials-based security vulnerabilities.

4. weak support for search engines.

5. destroys the abnormal mechanism of the program. At least from the current perspective, ajax frameworks such as ajax. dll and ajaxpro. dll will destroy the program's exception mechanism.

Debugging is difficult.

VII. Usage principles

1. Ajax application scenarios

Form-driven Interaction

Deep tree navigation

Fast communication and response between users

Similar scenarios with no impact such as voting and yes/no

Scenarios for filtering and manipulating Data

Common text input prompts and Automatic completion scenarios

2. Ajax not applicable scenarios

Some simple forms

Search

Basic navigation

Replace a large amount of text

Rendering operations

8. Native AJAX writing

Var XHR = null; if (window. XMLHttpRequest) {// non-IE kernel XHR = new XMLHttpRequest ();} else if (window. activeXObject) {// IE kernel. The earlier IE versions are written differently. For details, see XHR = new ActiveXObject ("Microsoft. XMLHTTP ") ;}else {XHR = null;} if (XHR) {XHR. open ("GET", "ajaxServer. action "); XHR. onreadystatechange = function () {// readyState value description // 0, initialization, XHR object created, open // 1 not executed, load, open method called, but no request has been sent // 2, the load is complete, the request has been sent // 3, interaction, some data can be received // status description // 200: success // 404: No file, query, or URl found // 500: the server generates an internal error if (XHR. readyState = 4 & XHR. status = 200) {// The returned content can be processed here // The console is generally returned in JSON or XML data format. log (XHR. responseText); // actively released. JS will also recycle XHR = null ;}}; XHR. send ();}

The above is a summary of the usage of Ajax introduced by xiaobian. I hope it will help you. If you have any questions, please leave a message and I will reply to you in a timely manner. Thank you very much for your support for the help House website!