ajax原理

一、GET

    创建ajax对象
        不兼容IE6
        var oAjax = new XMLHttpRequest();
        IE678
        var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
        兼容写法
        if(window.XMLHttpRequest){
            var oAjax = new XMLHttpRequest();
        }else{
            var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
        }
    打开链接
        oAjax.open('打开方式','url?data',是否异步);
        同步
                一次只能做一件事
        异步
                同时做多件事
        oAjax.open('GET','xxx?xxx=xxx',true);
    发送请求
        oAjax.send();
    接收响应
        oAjax.onreadystatechange = function(){
            判断ajax状态码
            if(oAjax.readyState==4){
                判断http状态码
                if(oAjax.status>=200&&oAjax.status<300||oAjax.status==304){
                    成功
                    oAjax.responseText
                    响应文本
                }else{
                    失败
                }
            }
        }

二、POST


    创建ajax对象
        不兼容IE6
        var oAjax = new XMLHttpRequest();
        IE678
        var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
        兼容写法
        if(window.XMLHttpRequest){
            var oAjax = new XMLHttpRequest();
        }else{
            var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
        }
    打开链接
        oAjax.open('打开方式','url?data',是否异步);
        同步
                一次只能做一件事
        异步
                同时做多件事
        oAjax.open('POST','url',true);
    设置请求头部
        oAjax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    发送请求
        oAjax.send(data);
    接收响应
        oAjax.onreadystatechange = function(){
            判断ajax状态码
            if(oAjax.readyState==4){
                判断http状态码
                if(oAjax.status>=200&&oAjax.status<300||oAjax.status==304){
                    成功
                    oAjax.responseText
                    响应文本
                }else{
                    失败
                }
            }
        }

你可能感兴趣的:(ajax原理)