Ajax 第一篇

Ajax

作用：

1. 向服务器请求额外的数据而无需卸载页面（也就是页面刷新），会带来更好的用户体验；

2. 异步 (当前端页面向后端执行程序的过程中，如果请求执行成功，那么我就会再回来处理这个请求响应，在请求还未执行成功，那么我的代码将继续执行下去)；

简介：Ajax技术的核心是XMLHttpRequest对象（XHR）；XHR提供了向服务器发送请求和解析服务器响应提供了流畅的接口，可以以异步的方式去从服务器去获取更多的信息；当用户触发了某一个事件，在不断刷新网页的情况下，更新服务器的最新数据；

一、实例化XMLHttpRequest对象

1. 在当今的各大浏览器中都支持原生的XHR对象，在这些浏览器中创建XHR对象可以实现实例化XMLHttpRequest，在编译器中new一个xhr即可， 我们创建并且将对象输出在控制台上
   我们打开控制台查看输出对象中的一些参数，在众多参数之间，我建议我们去查看以下四个就ok,如图：

2. ok，在我们使用XHR对象时，先必须去调用open()方法，去打开请求。这个方法他接受三个参数： 第一个参数为要发送的请求类型（get或者post) 第二个参数为请求的地址URL 第三个参数表示是否异步（true表示异步，false表示 同步）；

3.我们这里进行测试，在项目文件夹下新建一个txt文件，写入内容

随后我们需要在代码中去增加open()方法，并重新启动代码进行控制台输出


ok，看到这两个信息，准备请求已经成功了；
4. 接下来我们去调用send();方法去发送请求，他的参数为 如果是GET的请求方式，参数直接设置在请求的路径之后（？双引号内），我这里没有参数所以将参数设置为null; 如果是POST请求，有参数则设置参数，无参数设置为null；

运行后我们打开控制台进行查看

可以看到我们刚刚创建的test.txt中的内容被获取到了

当我们访问路径写错的情况下打开控制台他就会提示，如图

 

5. 解析响应

在刚刚的操作中我们不是已经请求成功然后拿到了他的xhr.responseText，接下来我们要将拿到的数据进行解析，然后进行使用吗？ok，我们在控制在进行解析并输出结果；


ok,下来我们可以尝试去新建一个json的文件并写进去内容然后进行解析操作，并且将获取到的json转化为数组形式；