Ajax

Ajax

    --“Asynchronous Javascript And XML”（异步JavaScript和XML ），是指一种创建交互式网页应用的网页开发技术。

执行流程：
1：ajax引擎(XMLHttpRequest)为对象注册一个监听器(事件处理函数，对状态的改变事件(readyStatechange)监听)
2：等待用户执行操作(例如点击)
3：触发了事件处理代码
4：调用ajax引擎
5：发送请求，ajax引擎被调用后单独向服务器发送请求(不是整个界面)——异步请求
6：服务器接受到了处理请求--开始处理
7：服务器将处理结果(xml或者文本)返回给了ajax引擎
8：监听相应数据
9：监听器对GUI数据更新

1：获得引擎XmlHttpRequest对象
   注意点:ie与别的浏览器获得方式不同
   function getXmlHttpRequest(){
            var xhr=null;
            if((typeof XMLHttpRequest)!='undefined'){
                xhr=new XMLHttpRequest();
                alert('dom')
            }else{
                xhr=new ActiveXObject('Microsoft.XMLHttp');
                alert('IE')
            }
            return xhr;
        }

重要参数：onreadystatechange——注册一个监听器(绑定时间处理函数)
 readyState返回与服务器通讯状态码Number类型：
0对象创建，但是没有初始化
1对象建立但是没有调用
2发送数据(send方法被调用)
3数据传送中
4响应结束
responseText——服务器返回的文本
responseXML——服务器返回的xml dom对象
status 获得状态码:
200;404;500

案例：

<button onclick="fun();">click me</button>

  <script type="text/javascript">
        function getXmlHttpRequest(){
            var xhr=null;
            if((typeof XMLHttpRequest)!='undefined'){
                xhr=new XMLHttpRequest();
            }else{
                xhr=new ActiveXObject('Microsoft.XMLHttp');
            }
            return xhr;
        }
        function fun(){
            //1:获得ajax核心对象
            var xhr=getXmlHttpRequest();

            //打开一个新的请求
            xhr.open('get','students.json',true);

            //添加一个监听器
                //监听器---ajax核心对象状态
            xhr.onreadystatechange=function(){

                //状态码来监听
                    //xhr.status---服务器响应状态 ---200   xhr.readyState---ajax状态码 4
                if(xhr.status==200&&xhr.readyState==4){
                    //响应成功
                    var data=xhr.responseText;
                    var stus=eval(data);
                    alert(stus[0].name)
                }
            }
            //发送请求
            xhr.send(null);
        }
    </script>