Ajax

Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。

1. 创建Ajax的步骤

（1）创建Ajax对象，new一个XMLHttpRequest的实例化对象
（2）连接到服务器
open(方法，文件名，同步/异步)
参数一：post/get

参数二：请求的文件名
参数三：同步（false） 异步（true）
同步与异步的区别
同步交互：指发送一个请求，需要等待返回，然后才能够发送下一个请求，有个等待过程
异步交互：指发送一个请求，不需要等待返回，随时可以再发送下一个请求，即不需要等待
（3）发送请求
（4）接收返回值，监听readyState值的变化

let xhr = new XMLHttpRequest();
xhr.open('get', 'abc.txt', true)
xhr.send();
xhr.onreadystatechange = function () {
    console.log(xhr.responseText)
}
 /* 使用live server 打开页面 */      

2. 请求状态码

        let xhr = new XMLHttpRequest();
        //0 请求未初始化 还没有调用到open方法
        console.log('请求未初始化', xhr.readyState);
        xhr.open('get', 'abc.txt', true)
        xhr.send();
        //1 服务器连接已建立 已调用send方法，正在发生请求
        console.log('服务器连接已建立', xhr.readyState);
        xhr.onreadystatechange = function () {
            //2 请求已接收 send方法完成，已接收到全部响应内容
            if (xhr.readyState == 2) {
                console.log('请求已接收', xhr.readyState)
            }
            //3 请求处理中 解析响应内容
            if (xhr.readyState == 3) {
                console.log('请求处理中', xhr.readyState)
            }
            //4 请求已完成 且响应已就绪
            if (xhr.readyState == 4) {
                console.log('请求已完成', xhr.readyState)
            }
            /* xhr.responseText 通过ajax请求获得的数据 */
            // console.log(xhr.responseText)
            console.log('响应状态码',xhr.status);
        }

3. 响应状态码 status

200 表示 请求成功
304 从http请求中的缓存拿来的数据
404 not found 表示找不到地址
403 表示没有权限（4开头，多为前端问题）
500 服务端代码错误（5开头，多为后端问题）