什么是AJAX？

Ajax即  Asynchronous Javascript And XML（异步JavaScript和XML）在 2005年被Jesse James Garrett提出的新术语，用来描述一种使用现有技术集合的‘新’方法，

包括: HTML 或 XHTML, CSS, JavaScript, DOM, XML, XSLT, 以及最重要的XMLHttpRequest。 

 使用Ajax技术网页应用能够快速地将增量更新呈现在用户界面上，而不需要重载（刷新）整个页面，这使得程序能够更快地回应用户的操作。 

什么是JSON？

JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式。它基于 ECMAScript (欧洲计算机协会制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率。

JSON格式数据

// json对象

// 注意：对象的属性名，必须要双引号引起来

        let obj={

            "name":"张三",

            "age":20,

            "gender":"男"

        }

// json数组

let arr=[

        {

            "name":"张三",

            "age":20,

            "gender":"男"

        },

        {

                "name":"李四",

                 "age":22,

                 "gender":"女"

        }

]

AJAX对象

使用原生AJAX请求数据

        01.创建xhr对象（原生xhr对象）

        let xhr = new XMLHttpRequest()

        readyState属性是读取状态，默认值0

        console.log(xhr.readyState);

        02.初始化请求，需要明确请求方式和请求地址

        请求方式包括：GET,POST,PUI,DELETE,常用的是GET 和 POET

        请求地址包括真实的后台接口，本地的JSON文件，

        注意：请求本地JSON文件只支持GET方式

        xhr.open('GET','./date/stu.json')

        当请求初始化完成时，状态值变成了1

        console.log(xhr.readyState);

        03.发送请求

        xhr.send()

        04.注册一个onreadystatechange事件，去监听回传的值

        xhr.onreadystatechange = function(){

            状态值变为2，表示请求发送成功

            状态值变为3，表示服务器成功接收到请求

            状态值变为4，表示服务器响应完成

            console.log(xhr.readyState);

            if(xhr.readyState===4){

                //status是响应状态码：200表示成功，404表示资源不存在，500表示服务错误

                console.log(xhr.status);

                if(xhr.status===200){

                    //JSON.parse（）方法，用于将JSON格式的字符串转为js对象

                    let data = JSON.parse(xhr.responseText)

                    console.log(data);

                }

            }

        }