标签：

            随着互联网的发展，交互式的程序，现在越来越多的从C/S专项B/S ,也就是浏览器代替了客户端，这里面就有一个问题，如果我用户的请求很多，难道每一个请求都要进行一次完全刷新才能得到我想要的吗？No，当然不是。这里就要用到好用，众多浏览器支持的AJAX来解决这个问题。

概念

AJAX（AsynchronousJavaScript and XML ），就是异步js和XML，它不属于新技术，更准确的来说是多种技术的融合，比如CSS、HTML、DOM、JS、XML。

CSS+HTML——网页的标准化；

DOM——动态修改文档的内容和结构；

XML——配置文件，进行数据的交换和处理；

JavaScript——简称JS，绑定上面的技术，使其可以协同工作，一会要讲其中一个非常重要的方法XMLHttpRequest。

举个例子：

去图书馆借书，但是你想借的书已经被借出，你就有两种选择：

一种是，一直等待，直到书还了，你再借（相当于用户请求，完全刷新，相当于不用异步操作）；

另一种，在图书馆预约，如果有还书，就通知你来借书，同时还可以继续借其他的书（用户请求，服务端进行响应，同时仍然接受用户的其他请求，使用了异步操作）。

利用AJAX最大的目标就是实现解决B/S中浏览器和服务器刷新，缺乏交互性的问题。。以下是AJAX实现交互的流程：

            从图中可以看到分为客户端和服务端，用户触发一个事件，创建一个XMLHttpRequest对象，对象向服务端发送请求，请求发出后继续响应用户的其他请求，当服务端接受到请求后，执行返回结果。客户端调用callback（）方法，对响应数据进行处理。

核心技术——XMLHttpRequest

创建XMLHttpRequest 对象

<span style="font-size:18px;">var xmlhttp;
function createXMLHttpRequest(){
    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
    else
      {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
}</span>

向服务器发送请求

<span style="font-size:18px;"><span style="font-size:18px;">xmlhttp.open("GET","test1.txt",true);
xmlhttp.send();</span></span>

1. 无法使用缓存文件（更新服务器上的文件或数据库）
2. 向服务器发送大量数据（POST 没有数据量限制）
3. 发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

利用DOM对服务器响应进行处理

AJAX原理

标签：

原文地址：http://blog.csdn.net/mayfla/article/details/46519659