Shulou(Shulou.com)06/03 Report--

This article will explain in detail how to understand ajax. The content of the article is of high quality, so the editor shares it for you as a reference. I hope you will have a certain understanding of the relevant knowledge after reading this article.

What is Ajax?

Ajax is an acronym for Asynchronous JavaScript and XML, and this technology can request additional data from the server without unloading the entire page, resulting in a good user experience. The traditional HTTP request process is like this: the browser sends the request to the server-> the server generates the response- based on the data sent by the browser > the server returns the response to the browser-> the browser refreshes the whole page to display the latest data. This process is synchronized and executed sequentially.

AJAX uses asynchronous data transfer (HTTP requests) between the browser and the Web server to obtain data from the server. In this case, async means that requests, loading, etc., are executed separately from the current browser page, which means that you can accept data from the server through JavaScript without reloading the entire web page, and then operate DOM to update the new data to some part of the web page. The most intuitive experience of using Ajax is that you don't need to refresh the page to wait to get new data from the server.

The understanding of ajax (1)

Ajax is the abbreviation of Asynchronous Javascript And XML. Function: through Ajax, you can use Javascript statements to call XMLHttpRequest objects, communicate directly with the server, and exchange data with the server without reloading the page. 1. Create a XML

Ajax is the abbreviation of Asynchronous Javascript And XML.

Function: through Ajax, you can use Javascript statements to call XMLHttpRequest objects, communicate directly with the server, and exchange data with the server without reloading the page.

1. Create a XMLHttpRequest object

Var xhr = new XMLHttpRequest ()

For earlier versions of IE (IE7 and below), create objects using new ActiveXObject (\ "Microsoft.XMLHTTP\"), new ActiveXObject (\ "Msxml2.XMLHTTP\"), etc.

2. Common properties and methods of XMLHttpRequest object

Attribute

Readystate returns the current status code of the XMLHTTP request

State returns the HTTP status code of the current request

StatusText returns the text corresponding to the HTTP status code

Method

Onreadystatechange listens for readystate and state statu

The understanding of ajax (2)

Ajax method: load remote data through HTTP request

Get method: request loading information through remote HTTP GET

Post method: request loading information through remote HTTP POST

1. Create a XMLHttpRequest object

Function createXHR () {return window.XMLHttpRequest? New XMLHttpRequest (): new ActiveXObject ("Microsoft.XMLHTTP");}

2. Convert key-value pairs into splicing strings

Function params (data) {var a = []; for (var i in data) {a.push (encodeURIComponent (I) + "=" + encodeURIComponent (data [I]));} return a.join ("&");}

3. Encapsulate the ajax method

Parameters.

Method request methods get and post default get

Data key-value pair {key:value}

Url link address

Cache cache true and false default true with cache

Success successful error exception

Function ajax (args) {var xhr = createXHR (); var data = http://www.cnblogs.com/kuikui/archive/2012/01/12/params(args.data); if (/ get/i.test (args.method)) {/ / when data is directly spliced into url in get mode, args.url + = "?" + data } if (! args.cache) {/ / No cache if (args.url.indexOf ("?") < 0) {/ / if no parameter data args.url + = "?";} args.url + = "&" + (new Date ()); / / Math.random ();} xhr.open (args.method, args.url, true) Xhr.onreadystatechange = function () {if (4 = = xhr.readyState & & 200 = = xhr.status) {args.success (xhr.responseText, xhr.responseXML);} else {args.error ();}} if (/ post/i.test (args.method)) {xhr.setRequestHeader ("Content-Type", "application/x-www-form-urlencoded"); xhr.send (data);} else {xhr.send () On how to understand ajax to share here, I hope that the above content can be of some help to you, can learn more knowledge. If you think the article is good, you can share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.