ajax异步编程

㈠ 什么是AJAX

教程请到原文获取：https://zhuanlan.hu.com/p/7

AJAX准备知识：JSON

什么是 JSON ？

• JSON 指的是 JavaScript 对象表示法（JavaScript Object Notation）

• JSON 是轻量级的文本数据交换格式

• JSON 独立于语言 *

• JSON 具有自我描述性，更易理解

* JSON 使用 JavaScript 语法来描述数据对象，但是 JSON 仍然独立于语言和平台。JSON 解析器和 JSON 库支持许多不同的编程语言。

啥都别多说了，上图吧！

㈡ 一分钟学会什么是Ajax及Ajax请求的五个步骤

AJAX的意思就是异步的JavaScript和XML。简而言之，它是使用XMLHttpRequest对象与服务器端通信的脚本语言。它可以发送及接收各种格式的信息，包括JSON、XML、HTML和文本文件。AJAX最为吸引人的就是它的“异步”特性，AJAX可以无需刷新页面而与服务器端进行通信。

Ajax请求的五个步骤：

1、建立xmlHttpRequest对象

if(window.XMLHttpRequest) {

xmlHttp = new XMLHttpRequest();

if(xmlHttp.overrideMimeType) {

xmlHttp.overrideMimeType("text/xml");
}
} else if(window.ActiveXobject) {

var activeName = ["MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];

for(var i = 0; i < activeName.length; i++) {

try {

xmlHttp = new ActiveXobject(activeName[i]);

break;

} catch(e) {}

}

}

if(!xmlHttp) {

alert("创建xmlhttprequest对象失败");

} else {}

2、设置回调函数

xmlHttp.onreadystatechange= callback;

function callback(){}

3、使用OPEN方法与服务器建立连接xmlHttp.open("get","ajax?name="+ name,true)

此步注意设置http的请求方式（post/get）,如果是POST方式，注意设置请求头信息xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded")

4、向服务器端发送数据

xmlHttp.send(null)；如果是POST方式就不为空

5、在回调函数中针对不同的响应状态进行处理

if(xmlHttp.readyState == 4){ //判断交互是否成功

if(xmlHttp.status == 200){ //获取服务器返回的数据 //获取纯文本数据

var responseText =xmlHttp.responseText;

document.getElementById("info").innerHTML = responseText;

}

}

(2)ajax异步编程扩展阅读：

Ajax优缺点

优点：

1、异步请求，不妨碍用户浏览页面或者其他操作。

2、局部刷新，无需重新刷新页面。

3、界面与应用分离。有利于分工合作、减少非技术人员对页面的修改造成的WEB应用程序错误、提高效率、也更加适用于现在的发布系统。

4、基于标准被广泛支持。

5、前端和后端负载平衡。最大程度的减少冗余请求和响应对服务器造成的负担，提升站点性能。

缺点：

1、back和History,对浏览器机制的破坏。

2、安全问题。易受到黑客攻击。

3、对搜索引擎支持较弱。

4、不能很好支持移动设备。

5、违背URL和资源定位的初衷。