阿·贾克斯(Ajax)

重要对象

XMLHttpRequest

  • 在不重新加载页面的情况下更新网页
  • 在页面已加载后从服务器请求数据
  • 在页面已加载后从服务器接收数据
  • 在后台向服务器发送数据

发送相关请求

GET、POST……

设置相关参数

setRequestHeader();

服务端响应JSON数据

XMLHttpRequest.responseType = 'json';//将响应体的信息指定为json

请求超时与网络异常处理

  1. 设置它请求超时的时间

XMLHttpRequest.timeout = [时间:毫秒]

  1. 绑定事件句柄ontimeout

    xhr.ontimeout = function(){};

取消请求

要使用到它的一个方法:abort()

请求重复发送

核心:需要一个标识变量(isSending)来标记请求是否正在发送

部分代码:

let isSending = false;
if(isSending){xhr.abort()};
xhr.onreadystatechange = function(){
                if (xhr.readyState == 4) {
                    document.getElementById("result").innerHTML = xhr.responseText;
                }
            }

利用jQuery发送Ajax请求

$.get(url,[待发送的参数],[载入成功的回调函数],[设置响应体的类型]);

同源策略(same-origin-policy)

是浏览器的安全策略

同源:协议、域名、端口号必须完全相同

JSONP

Jsonp(JSON with Padding) 是 json 的一种”使用模式”,可以让网页从别的域名(网站)那获取资料,即跨域读取数据。

值得注意的是