原生JS中ajax

一、 创建ajax 并实例化核心对象 XMLHttpRequest

if(window.XMLHttpRequest){//大部分浏览器
            ajax = new XMLHttpRequest();
        }else{//IE6、IE5浏览器
            ajax = new ActiveXObject("Micorsoft.XMLHttp");
        }

二、与服务器建立连接

ajax.open("get","package.json",true);
    //模板 ajax.open(type , url ,async);
    /*
    *type:标识请求类型（请求方式） get / post
    *url：请求地址   json的地址
    *async 标识 同步或异步  true(异步)/flase(同步) 这个参数可以省略 默认true;
    * */

三、向服务器发送请求

ajax.send(null);
    /*send方法 如果是get请求方式  则参数必须是null 不能省略*/

四、接受服务器的结果 监听事件：onreadystatechange事件

ajax.onreadystatechange=function () {
        //readyState是监听客户端与服务器端的通信状态当值为4 时候表示响应完毕  status=200表示请求正确
        if(ajax.status==200&&ajax.readyState==4){
            var data = ajax.responseText;
            console.log(data,typeof (data));


            data = JSON.parse(data);
            console.log(data,typeof (data));

            data = JSON.stringify(data);
            console.log(data,typeof (data));
        }
    }
    /*
       JSON.parse(data); //可以将json字符串转换成json对象
       JSON.stringify(data); //可以将json对象转换成json字符串 */

ajax => A JS and XML
ajax => Asynchronous JavaScript and XML

/*-*-*-*-*-*-*-*-*-*-*-*->ajax的重点理论<-*-*-*-*-*-*-*-*-*/


    /*XMLHttpRequest 对象提供了在网页加载后与服务器进行通信的方法。
    什么是 XMLHttpRequest 对象？
    XMLHttpRequest 对象是开发者的梦想，因为你能够：
    在不重新加载页面的情况下更新网页
    在页面已加载后从服务器请求数据
    在页面已加载后从服务器接收数据
    在后台向服务器发送数据*/

    // *****readyState
    /*状态			名称				描述
    0		Uninitialized		初始化状态。XMLHttpRequest 对象已创建或已被 abort() 方法重置。
    1		Open	open() 		方法已调用，但是 send() 方法未调用。请求还没有被发送。
    2		Sent	Send() 		方法已调用，HTTP 请求已发送到 Web 服务器。未接收到响应。
    3		Receiving(接受)			所有响应头部都已经接收到。响应体开始接收但未完成。
    4		Loaded(加载完毕)	HTTP 		响应已经完全接收。*/

这是一个封装的ajax

 function fun(){
        var ajax=null;
        if(window.XMLHttpRequest){
            ajax=new XMLHttpRequest();
        }else{
            ajax=new ActiveXObject("Micorsoft.XMLHTTP");
        }
        ajax.open(type,url,async);
        ajax.send(null);
        ajax.onreadystatechange=function(){
            if(ajax.readyState==4&&ajax.status==200){
                var data=JSON.parse(ajax.responseText);
                return data;
            }
        }
    }