原生AJAX与json、jsonp

(一)AJAX（Asynchronous JavaScript And XML[JSON]），阿贾克斯.异步的javascript和xmlXML 被设计用来传输和存储数据。（标记语言）

为什么要使用AJAX 

更自然、流畅的用户体验，对用户的操作即时响应

在不中断用户操作的情况下与Web服务器进行通信

更灵敏的响应用户访问，实现近似于桌面应用程序的交互效果

通过局部更新页面降低网络流量，提高网络的使用效率

实现动态局部刷新

(二)http请求

http请求：

1、建立一个TCP连接

2、web浏览器向web服务器发送请求命令

3、web浏览器发送请求头信息

4、web服务器应答

5、web服务器应答头信息

6、web服务器向浏览器发送数据信息

7、web服务器关闭TCP连接

一个HTTP请求一般由四部分组成

1、HTTP请求的方法或动作，是get请求还是post请求

2、请求的URL，请求地址

3、请求头，包含一些客户端信息，身份验证信息等

4、请求体，请求正文，请求正文包括客户端提交的查询信息，存储信息，表单验证信息等 一般请求头和请求体之间有一个空行，表示请求头的结束

http响应:

一个HTTP响应一般由三部分组成

1、一个由数字和文字组成的状态码，用来显示请求成功还是失败

2、响应头，包含一些服务器端信息，服务器类型、日期、时间等等

3、响应体，响应正文

(三)get请求和post请求的区别

一、根据HTTP规范，GET用于信息获取，而且应该是安全的和幂等的。一般不会对服务器端的数据产生副作用 幂等的意味着对同一URL的多个请求应该返回同样的结果 根据HTTP规范，POST表示可能修改变服务器上的资源的请求。

二、.GET请求的数据会附在URL之后，POST把提交的数据则放置在是HTTP包的包体中。get不安全，post请求会相对安全，get对所有人可见。

三、get请求提交的数据比较小，post大一些，get方式提交的数据最多是1024kb，post提交的数据理论上没有限制。

四、在表单当中，Method默认为“get”，实际上，get和post只是发送机制不同，并不是一个取一个发

(四)XMLHttpRequest对象

        XMLHttpRequest可以在不向服务器提交整个页面的情况下，实现局部更新网页。当页面全部加载完毕后，客户端通过该对象向服务器请求数据，服务器端接受数据并处理后，向客户端反馈数据。XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问，包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力 .

(五)原生AJAX的写法:

1、创建XMLHttpRequest对象     var request = new XMLHttpRequest();

2、设置请求参数     request.open("get", "http://10.0.152.17/AJAX/ajaxtest", true);

3、设置响应函数     request.onreadystatechange = function(){

    if(request.readyState == 4) {

        alert(request.responseText);   

}    

} 4、发送请求     request.send(string);

5、接收响应     request.responseText或者request.responseXML

(六)JSON的具体形式

JSON语法是一种用于传输和生成数据的协定，很类似于C家族的语言，所以很容易被C家族的语言所解析。

对象：对象包含在{}之间

属性：采用Key-Value对来表示。属性之间使用逗号分开。  string : value

数组：数组存放在[]之间   [ elements ]

元素：元素之间用逗号分开

值：值可以是字符串，数字，对象，数组，true，false，null

(七)JSON数据的转换 

eval(string)

作用：

          eval() 函数可计算某个字符串，并执行其中的 JavaScript 代码。

          即这个函数可以把一个字符串当作一个JavaScript表达式一样去执行它

语法：eval(string)

          参数string必需。要计算的字符串，其中含有要计算的 JavaScript 表达式或要执行的语句。

            如：服务器端返回一个JSON字符串，需要用eval把它转换为对象。或者数组。eval("("+json字符串+")");

返回值：

      通过计算 string 得到的值（如果有的话），即参数string有返回值，则eval的执行结果就有返回值

使用JSON作为数据传输格式，eval来做计算转换（JSON.parse()）

(八)什么是JSONP

Ajax直接请求普通文件存在跨域无权限访问的问题，甭管你是静态页面、动态网页、web服务、WCF，只要是跨域请求，一律不准；

Web页面上调用js文件时则不受是否跨域的影响（不仅如此，我们还发现凡是拥有”src”这个属性的标签都拥有跨域的能力，比如<script>、<img>、<iframe>）；