Getting started with ajax

Getting started with ajax

Ajax function: ajax is a technology that exchanges data with the server and updates some web pages without reloading the entire page. (realize the data exchange between the browser and the server, realize the page without refresh request server, and improve the user experience)

Basic use:

1. Create an ajax object:

New XMLHttpRequest () / / for ordinary browsers, ie browsers are special

two。 Create an event function (processing the results returned by the server):

Onreadystatechange

ReadyState ajax object status: 0: request not initialized 1: server connection established 2: request received 3: request processing 4 request completed and response

Status response code: 200VOK404: no page found: insufficient permissions

ResponseText accepts the data returned by the server

3. Initialize an ajax request

Get-xmlhttp.open ('GET',1.php?a=1&b=2&c-3',true)

Post-xmlhttp.setRequestHeader ('content-type','application/x-www-form-urlencoded "):

Xmlhttp.open ('POST','1.php',true)

4. Send ajax request-send ()

The server returns

Echo normal string

Ordinary html file

Returns the xml string

Indexed array

Associative array

Matters needing attention

Same origin policy-the current page should be the same as the server's protocol address and port

Post sends ajax request

-setRequestHeader ("content-type','application/x-www-from-urlencoded")

-send parameter send ("a=100&b=www")

The use of firebug

Example: / / 1. Create the ajax object var x = new XMLHttpRequest;//2. Trigger event x.onreadystatechange = function () {/ / onready prepare state status changge if (x.readyState = = 4 & & x.status = = 200) {console.log (x.responseText); / / returned result}} / / 3. Initialize x.open ('GET','fuxi.php?id=100',true); / / true Asynchronous false is synchronous / / 4 send x.send (); / / send ajax if it is post mode 3-step and 4-step change x.open (' POST','3.php',true); x.setRequestHeader ('content-type','application/x-www-form-urlencoded'); important x.send (' axiom 100 steps breadth 200')

Cooperate with php PDO pretreatment