ajax
ajax是无需刷新页面就能够从服务器获取数据的一种方法，负责ajax运作的核心对象是XMLHttpRequest,同源策略是对XHR的一个主要约束，它为通信设置了“相同域名，端口，协议”的限制
一.XHR的用法
// 创建xml对象
var xhr = new XMLHttpRequest();
// 启动一个请求，false同步，true异步
xhr.open(methods, url, false);
// 发送请求,send()方法接收一个参数，即要作为请求主体发送的数据。如果不需要通过请求主体发送数据，则必须传入 null，因为这个参数对有些浏览器来说是必需的
xhr.send(null);
/*xml响应属性
responseText: 响应主体返回的文本
status: 响应的HTTP状态
statusText: HTTP状态说明
状态代码为 304 表示请求的资源并没有被修改，可以直接使用浏览器中缓存的版本；当然，也意味着响应是有效的
*/
// 同步响应
if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304) {
alert(xhr.responseText);
} else {
alert("Request was unsuccessful: " + xhr.status);
}
/* 异步响应需要判断readyState 属性，该属性表示请求/响应过程的当前活动阶段
0：未初始化。尚未调用 open()方法。
1：启动。已经调用 open()方法，但尚未调用 send()方法。
2：发送。已经调用 send()方法，但尚未接收到响应。
3：接收。已经接收到部分响应数据。
4：完成。已经接收到全部响应数据，而且已经可以在客户端使用了。*/
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304) {
alert(xhr.responseText);
} else {
alert("Request was unsuccessful: " + xhr.status);
}
}
};
xhr.open("get", "example.txt", true);
xhr.setRequestHeader("MyHeader", "MyValue"); //设置请求头
xhr.send(null);
var myHeader = xhr.getResponseHeader("MyHeader"); //获取头部信息
var allHeaders = xhr.getAllResponseHeaders();
// 二.FormData 为序列化表单以及创建与表单格式相同的数据（用于通过 XHR 传输）提供了便利。下面的代码创建了一个 FormData 对象，并向其中添加了一些数据。
var data = new FormData();
data.append("name", "Nicholas");
// 使用 FormData 的方便之处体现在不必明确地在 XHR 对象上设置请求头部。XHR 对象能够识别传入的数据类型是 FormData 的实例，并配置适当的头部信息。
// 超时设定,IE8 为 XHR 对象添加了一个 timeout 属性，表示请求在等待响应多少毫秒之后就终止。在给timeout 设置一个数值后，如果在规定的时间内浏览器还没有接收到响应，那么就会触发 timeout 事件，进而会调用 ontimeout 事件处理程序。
xhr.timeout = 1000; //将超时设置为 1 秒钟（仅适用于 IE8+）
xhr.ontimeout = function () {
alert("Request did not return in a second.");
};
// 三.跨域处理
// 1.跨源资源共享:CORS 背后的基本思想，就是使用自定义的 HTTP 头部让浏览器与服务器进行沟通，从而决定请求或响应是应该成功，还是应该失败。
//Ie浏览器实现跨域需要创建 XDomainRequest对象，其他浏览器在尝试打开不同来源的资源时，无需额外编写代码就可以触发这个行为。要请求位于另一个域中的资源，使用标准的 XHR 对象并在 open()方法中传入绝对 URL 即可
/* 2.JSONP
JSONP 由两部分组成：回调函数和数据。回调函数是当响应到来时应该在页面中调用的函数。回调函数的名字一般是在请求中指定的。而数据就是传入回调函数中的JSON数据。
http://freegeoip.net/json/?callback=handleResponse; JSONP是通过动态script来使用的
function handleResponse(response){
alert("You’re at IP address " + response.ip + ", which is in " +
response.city + ", " + response.region_name);
}
var script = document.createElement("script");
script.src = "http://freegeoip.net/json/?callback=handleResponse";
document.body.insertBefore(script, document.body.firstChild);
缺点：JSONP 是从其他域中加载代码执行。如果其他域不安全，很可能会在响应中夹带一些恶意代码
要确定 JSONP 请求是否失败并不容易
*/
/*
3.Web Sockets
*/
