JavaEE中级.20190531.XMLHttpRequest.GET 与POST.Ajax同步和异步.封装ajax.jQuery的ajax.

一.XMLHttpRequest

           1.Ajax技术核心是XMLHttpRequest对象(简称XHR)，这是由微软首先引入的一个特性，其他浏览器提供商后来都提供

     了相同的实现。

           2.当请求发送到服务器端，收到响应后，响应的数据会自动填充XHR 对象的属性。那么一共有四个属性：

               

          3.接受响应之后，第一步检查status 属性，以确定响应已经成功返回。一般情况HTTP 状态代码为200 作为成功的标志。

             除了成功的状态代码，还有一些别的：

                

            4.同步调用固然简单，但使用异步调用才是我们真正常用的手段。使用异步调用的时候，检测readyState 属性,每当                         readyState 属性改变时，触发readystatechange 事件。这个属性有五个值：

                

二.GET 与POST

             在提供服务器请求的过程中，有两种方式，分别是：GET 和POST。在Ajax 使用的过程中，GET 的使用频率要比

       POST 高。

             1.GET 请求

                       GET 请求是最常见的请求类型，最常用于向服务器查询某些信息。必要时，可以将查询字符串参数追加到

                URL的末尾，以便提交给服务器。
                        xhr.open('get','diner/login?'+'name=Lee&age=100',true);
                 通过URL 后的问号给服务器传递键值对数据，服务器接收到返回响应数据。特殊字符传参产生的问题可以使用                             encodeURIComponent()进行编码处理，中文字符的返回及传参，可以将页面保存和设置为utf-8 格式即可，

                  AJAX 返回的数据为UTF-8。

                         当没有encodeURIComponent()方法时，在一些特殊字符比如“&”，会出现错误导致无法获取。

              2.POST 请求

                         POST 请求可以包含非常多的数据，我们在使用表单提交的时候，很多就是使用的POST 传输方式。
                               xhr.open('post', 'diner/login', true);
                         而发送POST 请求的数据，不会跟在URL 的尾巴上，而是通过send()方法向服务器提交数据。
                               xhr.send('name=Lee&age=100');
                        一般来说，向服务器发送POST 请求由于解析机制的原因，需要进行特别的处理。因为POST 请求和Web

                  表单提交是不同的，需要使用XHR 来模仿表单提交。
                               xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
                         从性能上来讲POST 请求比GET 请求消耗更多一些，用相同数据比较，GET最多比POST 快两倍。

三.Ajax同步和异步（GET请求）

         1.Ajax:
                   异步无刷新技术。能够请求后台发送和获取数据，而无需卸载页面（刷新页面）。

            同步：

                    提交请求->等待服务器处理->处理完毕返回这个期间客户端浏览器不能干任何事。一心一意,当前只能做一件

            事，其他事情必须等当前的事情完成，才能继续后面的事情。
            异步:

                   请求通过事件触发->服务器处理（这时浏览器仍然可以做其他事情）->处理完毕 。三心二意：同时可以做多件

            事情：左手按着空格键，右手可以不断的击打鼠标，眼睛还要同时看着屏幕，很辛苦。
         2.核心对象：
                    XMLHttpRequest对象
                    var  xhr = new XMLHttpRequest()
                   在使用 XHR 对象时，先必须调用 open()方法，它接受三个参数：要发送的 请求类型(get、post)、请求的 URL 和

            表示是否异步。open()方法并不会真正发送请求，而只是启动一个请求以备发送。
                   通过 send()方法进行发送请求，send()方法接受一个参数，作为请求主体发送的数据。如果不需要则，必须填 null。               执行 send()方法之后，请求就会发送到服务器上。      
         3.发送的请求的步骤：
                    1）得到XMLHttpRequest对象
                          new XMLHttpRequest()
                    2）准备请求   open(请求类型GET/POST,请求的URL,是否异步)  
                          xhr.open(请求类型GET/POST,请求的URL,是否异步);
                    3）发送请求     send([参数]) 
                          xhr.send([参数])
                         注：如果是GET请求，请求的参数设置在url的后面，所以send(null)