Ajax技术原理分析

可以说Ajax不是一项技术，而是一种Web交互的操作模式。同时，Ajax并不是这两年出现的什么新东西，因为所有实现Ajax应用程序的组件都已经在我们的浏览器里存在若干年了。

下面的时序图可以清晰的展现Ajax技术在客户端与服务器之间往返交换数据的过程。

Ajax通过浏览器内置的XMLHttpRequest对象与服务器端交互，但需要注意的是，不同的浏览器，创建XMLHttpRequest对象的方法可能不相同，使用下面的代码应该可以保证在绝大多数的浏览器中创建此对象：

/**//*

 * Returns a new XMLHttpRequest object, or false if this browser

 * doesn't support it

 */

function newXMLHttpRequest() 

...{

  var xmlreq = false;

  if (window.XMLHttpRequest) 

  ...{

    // Create XMLHttpRequest object in non-Microsoft browsers

    xmlreq = new XMLHttpRequest();

  } 

  else if (window.ActiveXObject) 

    // Create XMLHttpRequest via MS ActiveX

    try 

    ...{

      // Try to create XMLHttpRequest in later versions

      // of Internet Explorer

      xmlreq = new ActiveXObject("Msxml2.XMLHTTP");

    } 

    catch (e1) 

      // Failed to create required ActiveXObject

      try 

      ...{

        // Try version supported by older versions

        // of Internet Explorer

        xmlreq = new ActiveXObject("Microsoft.XMLHTTP");

      } 

      catch (e2) 

        // Unable to create an XMLHttpRequest with ActiveX

      }

    }

  }

  return xmlreq;

}

XMLHttpRequest对象readyState属性的意义在于表示一次Ajax请求的生命周期状态，它从0（代表“未初始化”）变化到4（代表“完成”）。每次readyState属性变化时，readystatechange事件就触发，则由onreadystatechange属性指定的事件处理回调函数就被调用。

XMLHttpRequest对象status属性的意义在于查看请求是否成功完成。status属性指向服务器响应的HTTP状态返回码。在执行简单的GET和POST请求时，可以假设任何大于200的返回码都是错误的。

如果服务器发送重定向响应（例如301或302），浏览器会透明地进行重定向并从新的位置获取资源；XMLHttpRequest看不到重定向的状态码。而且，浏览器会自动添加"Cache-Control: no-cache"头信息到所有XMLHttpRequest，这样客户端代码永远也不用处理304（未经修改）服务器响应。

需要注意的是，只有当HTTP状态返回码为200（OK状态）时，才表示服务器处理结果正确返回，然后才能执行客户端响应代码。

     本文转自胡奇 51CTO博客，原文链接：http://blog.51cto.com/huqicto/280680，如需转载请自行联系原作者