本文共 4886 字，大约阅读时间需要 16 分钟。
Ajax让网页能动态接受网络服务器的数据。
它的运行方式如下： 客户端发起Ajax请求，然后等待响应。 服务器收到请求，以相应的数据作为响应。 收到服务器的相应后，客户端立即拿起数据并将其假如网页中，而且网页不用重新载入。 （javascript作为居中的 媒介，发起请求，处理响应并且整合数据到网页中。）在HTML中的ML，指的是markup language（标记语言），也指出了HTML使用了标签tag和属性attribute创建超文本(HT)。
而XML是种作为任何类型的数据设计格式的标记语言。 XML没有定义任何标签和属性，它只是一组标签与属性该如何创建与使用的规则。 一切说明特定数据表现方式的标签与属性规范都交给各个XML应用程序。 ** XML 创建自己的标签** 如下：Gleaming the Cube 01/13/1989 Grame Clifford skateboarder investigates the death of his adopted brother
JavaScript内置一个称为XMLHttpRequest的对象，用于发起Ajax请求并处理Ajax响应。这个对象非常复杂，包含许多通力合作以支持Ajax的方法与特性：
readyState属性：请求的状态代码：0（未初始）、1（开启）、2（已传送）、3（接收中）、4（已载入） status属性：HTTP的请求状态代码、例如404或者200 onreadystatechange属性：它存储一个引用，引用于Ajax请求的状态改变时被调用的自定义事件处理器——这个事件处理器就是处理响应的地方。 responseText属性：由服务器返回的响应数据，格式为纯文本字符串。 responseXML属性:由服务器返回的相应数据，格式为XML节点树构成的对象。 abort()：取消请求，这个方法只用在需要取消Ajax请求的时候。 open()：准备请求，指定请求的类型、URL及其他细节。 send()：传送请求，交给服务器处理。 XMLHttpRequest的威力很强大，同时具有惊人的灵活性。但是带来的缺点就是复杂度，即便是最基础的Ajax请求，也需要相当数量的Javascript代码。 var request=null;if(window.XMLHttpRequest){ try{ request=new XMLHttpRequest(); }catch(e){ request=null; }}else if{ window.ActiveXObject}{ try{ request=new ActiveXObject("Msxm12.XMLHTTP"); }catch(e){ try{ request=new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){ request=null; } }}if (request == null) alert("Ajax error creating the request.\n" + "Details: " + e); 由于XMLHttpRequest对象要在数种浏览器上运作，需要以上的代码:
(window.ActiveXObject)的作用，用来判断浏览器是否支持ActiveX控件，如果支持ActiveX控件，我们可以利用var xml=new ActiveXObject("Microsoft.XMLHTTP")的形式来创建XMLHTTPRequest对象（这是在IE7以前的版本中）。在较新的IE版本中可以利用var xml=new ActiveXObject("Msxml2.XMLHTTP")的形式创建XMLHttpRequest对象；而在IE7及非IE浏览器中可以利用var xml=new XMLHttpRequest()创建XMLHttpRequest对象。因此我们在创建这个对象的时候必须得考虑浏览器的兼容问题。 //服务器响应我们的请求时收到调用的自定义函数handlerrequest.onreadystatechange=handler;//开启请求，让请求准备被传送，同时决定请求的类型（GET或POST）request.open(type,url,true);//异步(true)
创建XMLHttpRequest对象后，换成设定处理请求的函数，然后开启请求。
开启请求时，指定请求的类型get或者post，还有服务器的Url，以及是否请求异步。因为异步不用让脚本等待，所以几乎所有Ajax请求都是异步。 关于GET与POST GET：不会改变服务器上任何事务的数据获取方式。如果需要，还是能透过URL传入小量数据给服务器。GET非常适合从服务器的XML文件获取博客数据。request.open("GET","blog.xml",true);request.send(null);//因为请求被传送时没有数据，所以是Null POST：此处传给服务器的数据，因为某种方式会改变服务器状态，例如存储数据到数据库中。数据还是能在响应中返回。POST是使用网页表单动态新增加博客日志、评论等这类任务的理想助手。
request.open("POST","addblogentry.php",true);request.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=UTF-8");request.send("09/26/2008&These dreams just...&cubeapart.png"); get和post更多的区别：
虽然XMLHttpRequest对象极为强大，但是过于麻烦。所以出现了一些第三方函数库，让其使用简单，这些函数库都扩展了JavaScript功能。
下面我们自己定义一个AjaxRequest对象：// AjaxRequest object constructorfunction AjaxRequest() { // Try the XMLHttpRequest object first if (window.XMLHttpRequest) { try { this.request = new XMLHttpRequest(); } catch(e) { this.request = null; } // Now try the ActiveX (IE) version } else if (window.ActiveXObject) { try { this.request = new ActiveXObject("Msxml2.XMLHTTP"); // Try the older ActiveX object for older versions of IE } catch(e) { try { this.request = new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) { this.request = null; } } } // If the request creation failed, notify the user if (this.request == null) alert("Ajax error creating the request.\n" + "Details: " + e);}// Send an Ajax request to the serverAjaxRequest.prototype.send = function(type, url, handler, postDataType, postData) { if (this.request != null) { // Kill the previous request this.request.abort(); // Tack on a dummy parameter to override browser caching url += "?dummy=" + new Date().getTime(); try { this.request.onreadystatechange = handler; this.request.open(type, url, true); // always asynchronous (true) if (type.toLowerCase() == "get") { // Send a GET request; no data involved this.request.send(null); } else { // Send a POST request; the last argument is data this.request.setRequestHeader("Content-Type", postDataType); this.request.send(postData); } } catch(e) { alert("Ajax error communicating with the server.\n" + "Details: " + e); } }}AjaxRequest.prototype.getReadyState = function() { return this.request.readyState;}AjaxRequest.prototype.getStatus = function() { return this.request.status;}AjaxRequest.prototype.getResponseText = function() { return this.request.responseText;}AjaxRequest.prototype.getResponseXML = function() { return this.request.responseXML;} 自定义的AjaxRequest对象由构造函数和数个方法组成，其中有一个方法特别重要：send()
send(type,url,handler,postDataType,postData); type：请求的类型。 url：服务器的URL。如有需要，数据也可以包装在URL里。 handler：用于处理响应的回调函数。 postDataType：被传送的数据类型（只用于POST） postData：被传送的数据（只用于POST） 所以GET请求可以省略后面两个参数。进一步来说，前三个自变量对于send方法而言，尤其重要。 转载地址：http://nulz.baihongyu.com/