手写ajax请求

11，手写ajax请求

ajax指的是通过js的异步通信，从服务器获取xml文档从中提取数据，再更新网页的对应部分，而不用去刷新整个网页。

创建ajax请求的步骤：

创建一个XMLRequest对象。

在这个对象上使用open方法创建一个http请求，open方法所需要的参数是请求的方法，请求的路径，是否异步和用户的认证信息。

在发起请求之前，可以为这个对象添加一些信息和监听函数，比如通过setRequestHeader方法来为请求添加头信息，还可以为这个额对象添加一个状态监听函数。

一个XMLHttpRequest对象一共有5个状态，当她的状态变化时，会触发onreadystatechange时间，可以通过设置监听函数，来处理请求成功之后的结果，当对象readyState变成4的是偶，代表服务器返回的数据接收完成，这个时候，可以通过判断请求的状态，如果状态时2**或者是304的话就代表返回正常，这个时候就可以通过response中的数据对页面进行更新。

当对象的属性和监听函数设置完成之后，最后调用sent方法来向服务器发送请求，可以传入参数作为发送的数据体。

<script>
          function ajaxText(url) {
               // 1,创建对象
               let xhr = new XMLHttpRequest();
               // 2，创建http请求
               xhr.open('GET',url,true)
               // 3，设置状态监听函数
               xhr.onreadystatechange = function(){
                    if(this.readyState !== 4) return
                    if(this.status === 200){
                         handle(this.response)
                    }else{
                         console.error(this.statusText)
                    }
               }
               // 设置请求失败时的监听函数
               xhr.onerror = function(){
                    console.error(this.statusText);
               }
               // 设置请求头信息
               xhr.responseType = 'json'
               xhr.setRequestHeader('Accept','application/json')
               // 发送请求
               xhr.send()
          }  
     </script>