AJAX【Asynchronous异步的JS和XML】，工作原理与特点

 

（1）什么是同步：

             请求1->响应1->请求2->响应2->

       Web1.0时代

 

   （2）什么是异步：

             请求1->请求2->请求3->响应1->响应2->响应3->

             请求1->响应1->请求2->请求3->响应2->响应3->

             Web2.0时代

       项目中：Web1.0为主（整个浏览器刷新），Web2.0为辅（浏览器局部刷新）

 

   （3）什么是AJAX

                   客户端（特指PC浏览器）与服务器，可以在【不必刷新整个浏览器】的情况下，与服务器进行异步通讯的技术      

             即，AJAX是一个【局部刷新】的【异步】通讯技术

             AJAX不是全新的语言，是2005年Google公司推出的一种全新【编程模式】，不是新的编程语言

       老技术新用法(js+dom+xml+html)

   （4）不用刷新整个页面便可与服务器通讯的办法有：

      （A）Flash/ActionScript

      （B）框架Frameset

      （C）iFrame（内嵌入框架)

      （D）XMLHttpRequest(非IE浏览器)和ActiveXObject(IE浏览器)

                  背景：早上IE5时，微软就开发出了第一个异步通讯对象，叫ActiveXObject对象，

                  Firefox等其它浏览器厂商也慢慢引入异步通讯对象，叫XMLHttpRequest对象，

                  IE的高版本，也将这个异步对象取名叫XMLHttpRequest对象，但IE有向下兼容问题，

              也可以使用ActiveXObject对象。

                              无需第三方jar包，现代中高版本浏览器中内置了这个异步通讯对象，只需通过JavaScript就可以创建

                    注意：所有浏览器中都内置了异步对象，在默认情况下，该异步对象并没有创建出来

 

function createAJAX(){     var ajax = null;     try{        ajax = new ActiveXObject("microsoft.xmlhttp");     }catch(e1){        ajax = new XMLHttpRequest();     }     return ajax; }

（5）AJAX工作原理

 

 

 

AJAX包含的技术

 

 

 

（7）AJAX开发步骤

             步一：创建AJAX异步对象，例如：createAJAX()

           步二：准备发送异步请求，例如：ajax.open(method,url)

             步三：如果是POST请求的话，一定要设置AJAX请求头，例如：ajax.setRequestHeader()

                   如果是GET请求的话，无需设置设置AJAX请求头

             步四：真正发送请求体中的数据到服务器，例如：ajax.send()

步五：AJAX不断的监听服务端响应的状态变化，例如：ajax.onreadystatechange，后面写一个无名处理函数      

             步六：在无名处理函数中，获取AJAX的数据后，按照DOM规则，用JS语言来操作Web页面      

 

   （8）AJAX适合用在什么地方

             AJAX【适合】不用来传递大量数据，而只用来【传递少量数据】，在用户的【体验】上，【更加人性化】

             AJAX是一个和服务器无关的技术，即服务器可使用：JavaEE，.NET，PHP，。。。这些技术都可

             AJAX只管向服务器发送请求，同时只管接收服务器的HTML或XML或JSON载体响应

       服务端不能使用转发或重定向到web页面，因为这样会起浏览器全面刷新

             即只能以流的方式响应给浏览器

   

       HTML XML JSON是数据载体(用来传送数据的)