07-16作业：Ajax的使用GET和POST

课程涉及远程提交URL，测试了很多次还是有问题，所以用文本方式提交

Ajxa是一种创建快速动态网页数据交互的技术。

-------------------------------------------------------------------------------------------------------------------------------

应用.1

XMLHttpRequest 对象是AJAX实现的基础。用于在后台与服务器交换数据。创建XMLHttpRequest对象实例的方法和普通对象实例化的方法一样，如：var  input = new XMLHttpRequest( );

XMLHttpRequest对象包括两个方法完成数据传输，

open( )方法：obj.open(method ,url ,async )  obj.open(“请求类型","服务器受理文件位置","true(异步) | false(同步)")

send( )方法：obj.send(string)  obj,send("将请求发送到服务器") string仅用于POST请求。

open( )方法中的请求类型分为GET类型 和POST类型,GET更简单也更快，并且大部分情况下都能用，但是不适合大量数据发送

在发送大量数据时或发送包含未知字符的用户输入时，使用POST更稳定。

一般情况下，使用POST类型传输数据时，需要在open( )方法之后，再使用setRequestHeader( header,value )，设置响应的表头信息，用途是将待传输的数据，包装成表单数据传输。header: 表头名称   value：数值

setRequestHeader("Content-type","application/x-www-form-urlencode")  基本都是固定这样的写法。

-----------------------------------------------------------------------------------------------------------------------------

.AJAX服务端的响应.

服务端响应返回的数据，一般使用两个属性来表示，1、responseText  属性   或  2、responseXML 属性

1、responseText  属性 获得字符串形式的响应数据。

2、responseXML 属性，获得XML形式的响应数据。

鉴于当前大多以JSON传输数据，所以基本以responseText，注意传输数据和接收数据时将数据转换成字符串。

3、AJAX的监听事件 onreadystatechange事件 

当AJAX请求被发送到服务器时，客户端需针对一些服务器的返回状态进行响应任务执行。即当服务器响应 readyState状态改变

时，会触发onreadystatechange事件。readyState的状态有5种，我们要课程所关注的是返回状态 readyState =4 即可

影响onreadystatechange触发事件的状态常见的有两类1. readyState      2.status 状态 

------------------------------------------------------------------------------------------------------------------------------

AJAX异步请求基本步骤
 
1. 创建: 请求对象
2. 监听: 成功回调
3. 设置: 请求参数

4. 发送: 异步请求

.AJAX步骤案例如下：

1. 创建               var  input = new XMLHttpRequest()  

                       这里input看个人的写法，request,xhr, xh.....都可以

2. 状态监听        input.onreadystatechange =function(){

                            if(readyState ==4 && status==200){

                                     var res = input.responseText 

                                      }

                            }

3.    设置get方式为          input.open("GET", url , true)  

      设置post方式为        input.open("POST",url, true)

当类型为POST时，要设置文件头属性， setRequestHeader("content-type","application/x-www-from-urlencoded")                                          

4. 发送             input.send()