AJAX -- Asynchronous JavaScript And XML ,异步 JavaScript 和 XML。ajax 的语言载体是 javascript。
AJAX 涵盖了五方面的内容：
1. 使用 XHTML 和 CSS 的基于标准的表示技术
2. 使用 DOM 进行动态显示和交互
3. 使用 XML 和 XSLT 进行数据交换和处理
4. 使用 XMLHttpRequest 进行异步数据检索
5. 使用 JavaScript 将以上技术融合在一起
AJAX 能做什么：
1. 改善表单验证方式，不再需要打开新页面，也不再需要将整个页面数据提交
2. 不需刷新页面就可以改变页面内容，减少用户等待时间
3. 按需获取数据，每次只从服务器端获取需要的数据
4. 读取外部数据，进行数据处理整合
5. 异步与服务器进行交互，在交互过程中用户无需等待，仍可继续操作
AJAX 的使用：
1. 创建 ajax 对象
1.1 主流浏览器（火狐，google，苹果safari，opera，IE7+）方式
var xhr = new XMLHttpRequest();
1.2 IE(6/7/8)方式
var xhr = new ActiveXObject("Microsoft.XMLHTTP"); //最原始方式
var xhr = new ActiveXObject("Msxml2.XMLHTTP"); //升级
var xhr = new ActiveXObject("Msxml2.XMLHTTP.3.0"); //升级
var xhr = new ActiveXObject("Msxml2.XMLHTTP.5.0"); //升级
var xhr = new ActiveXObject("Msxml2.XMLHTTP.6.0"); //最高版本方式（停止维护）
自动识别浏览器：
if ( typeof XMLHttpRequest != "undefined" ) { ... }
兼容：
var xhr;
if( winodow.XMLHttpRequest ) {
xhr = new XMLHttpRequest(); /ie7, firefox, chrome, opera, safari ...
} else {
xhr = new ActiveObject("Microsoft.XMLHTTP"); // ie5,6
}
2. 发起对服务器的请求
3. 接收服务器返回的信息
浏览器可以接收的信息 ajax 都可以接收，例如字符串、html 标签、css 样式内容、xml 内容、json 内容等。
4. get 和 post 方式的 ajax 请求
-------------------------------------------------------------------------------------------------------
什么是HTTP
http 是计算机通过网络进行通信的规则。主要使浏览器能够从服务器请求信息和服务。http 是一种无状态的协议，无状态是不建立持久的连接，也就是说服务端不保留连接的一些相关信息。一个客户端向服务器发送 web 请求，然后 web 服务器返回响应，接着连接就会关闭了，这个处理过程是没有记忆的，如果后续处理需要之前传递的一些信息，那就需要重新的传递。
一个完整的 HTTP 请求过程，通常有7个步骤：
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. 请求体，也就是请求正文，请求正文中可以包含客户提交的查询字符串信息，表单信息等
GET：
一般用于信息获取，比如查询，不会影响数据本身
使用 url 传递参数
对所发送信息的数量也有限制，一般在 2000 个字符
发送的信息对任何人都是可见的，因为所有的变量名和值都显示在 url 中
POST：
一般用于修改服务器上的资源，如发送表单数据，新建、修改、删除等
对所发送信息的数量无限制
一个 HTTP 响应一般由三部分组成：
1. 一个数字和文字组成的状态码，用来显示请求成功还是失败
2. 响应头，响应头也和请求头一样包含许多有用的信息，如服务器类型、日期时间、内容类型和长度等
3. 响应头，也就是相应正文
如：
HTTP/1.1 200 OK
Date: Sun, 23 Nov 2014 10:14:45 GMT
Server: Apache
Content-Encoding: gzip
Content-Length: 7112
Connection: Keep-Alive
Content-Type: application/javascript
HTTP 状态码由3位数字构成，其中收尾数字定义了状态码的类型：
1XX: 信息类，表示收到 web 浏览器请求，正在进一步的处理中
2XX: 成功，表示用户请求被正确接收，理解和处理，例如 200 OK
3XX: 重定向，表示请求没有成功，客户必须采取进一步的动作
4XX: 客户端错误，表示客户端提交的请求有错误，例如 404 NOT Found，意味着请求中所引用的文档不存在
5XX: 服务器错误，表示服务器不能完成对请求的处理，如 500
-----------------------------------------------------------------------------------------------------------------
XMLHttpRequest 发送请求：
request.open("GET", "get.php", true);
request.send();
request.open("post", "create.php", true);
request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
request.send("name=jim&sex=male");
XMLHttpRequest 取得响应：
0：请求未初始化，open 还没有调用
1：服务器连接已建立，open 已经调用了
2：请求已接收，也就是接收到头信息了
3：请求处理中，也就是接收到响应主体了
4：请求已完成，且响应已就绪，也就是响应完成了
例如：
var request = new XMLHttpRequest();
request.open("GET", "get.php", true);
request.send();
request.onreadystatechage = function(){
if(request.readyState === 4 && request.status === 200) {
// 做一些事情 request.responseText
}
}
---------------------------------------------------------------------------------------------
PHP 是一种创建动态交互性站点的服务器端脚本语言
PHP 能够生成动态页面内容
PHP 能够创建、打开、读取、写入、删除以及关闭服务器上的文件
PHP 能够接收表单数据
PHP 能够发送并取回 cookies
PHP 能够添加、删除、修改数据库中的数据
PHP 能够限制用户访问网站中的某些页面
---------------------------------------------------------------------------------------------
JSON 基本概念：
JSON: javascript 对象表示法（JavaScript Object Notation）
JSON 是存储和交换文本信息的语法，类似 XML。它采用键值对的方式来组织，易于人们阅读和编写，同时也易于机器解析和生成。
JSON 是独立于语言的，也就是说不管什么语言，都可以解析 json，只需要按照 json 的规则来就行
JSON 和 XML 比较：
json 的长度和 xml 格式比起来很短小
json 读写的速度更快
json 可以使用 JavaScript 内建的方法直接进行解析，转换成 JavaScript 对象，非常方便
JSON 语法规则：
JSON 数据的书写格式是：名称/值对
名称/值对组合中的名称卸载前面（在双引号中），值对写在后面（同样在双引号中），中间用冒号隔开，比如" name " : " amy "
JSON 的值可以是下面这些类型：
数字（整数或浮点数），比如 123，1.23
字符串（在双引号中）
逻辑值（ true 或 false ）
数组（在方括号中）
对象（在花括号中）
null
JSON 解析：
eval 和 JSON.parse
在代码中使用 eval 是很危险的，特别是用它执行第三方的 JSON 数据（其中可能包含恶意代码）时，尽可能使用 JSON.parse() 方法解析字符串本身，该方法还可以捕捉 JSON 中的语法错误。
JSON 校验工具：
JSONLint 地址：jsonlint.com
用 jQuery 实现 Ajax
jQuery.ajax([settings])
type: 类型，“POST” 或 “GET”， 默认为“GET”
url: 发送请求的地址
data: 是一个对象，连同请求发送到服务器的数据
dataType: 预期服务器返回的数据类型。如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息来之能判断，一般我们采用 json 格式，可以设置为 json
success: 是一个方法，请求成功后的回调函数。传入返回后的数据，以及包含成功代码的字符串
error: 是一个方法，请求失败时调用此函数。传入 XMLHttpRquest 对象
jQuery.getJSON(url,data,success(data,status,xhr)) 等价于：
$.ajax({ url: url, data: data, success: callback, dataType: json
});
跨域：
一个域名地址的组成：
http:// www . abc.com : 8080 / scripts/jquery.js
协议 子域名 主域名 端口号 请求资源地址
当协议、子域名、主域名、端口号中任意一个不相同时，都算作不同域。
不同域之间相互请求资源，就算作“跨域”。比如 http://www.abc.com/index.html 请求 http://www.efg.com/service.php
JavaScript 出于安全方面的考虑，不允许跨域调用其他页面的对象。什么是跨域呢，简单的理解就是因为 JavaScript 同源策略的限制，a.com 域名下的 js 无法操作 b.com 或是 c.a.com 域名下的对象。
比如：www.abc.com/index.html 调用 www.abc.com/service.php -- 非跨域
www.abc.com/index.html 调用 www.efg.com/service.php -- 跨域
www.abc.com/index.html 调用 bbs.abc.com/service.php -- 跨域
www.abc.com/index.html 调用 www.abc.com:81/service.php -- 跨域
www.abc.com/index.html 调用 https://www.abc.com/service.php -- 跨域
处理跨域：
方法一代理：
通过在同域名的 web 服务器端创建一个代理：北京服务器（域名：www.beijing.com）上海服务器（域名：www.shanghai.com）
比如在北京的 web 服务器的后台（www.beijing.com/proxy-shanghaiservice.php）来调用上海服务器（www.shanghai.com/service.php）的服务，然后再把响应结果返回给前端，这样前端调用北京同域名的服务就和调用上海的服务效果相同了。
方法二JSONP：
JSONP 可用于解决主流浏览器的跨域数据访问的问题。(JSONP的方式只支持 GET 请求，不支持 POST 请求) JSONP 返回的是一个数组。
在www.aaa.com 页面中：
<script>
function jsonp(json){
alert(json["name"]);
}
</script>
<script src="http://www.bbb.com/jsonp.js"></script>
在www.bbb.com页面中：
jsonp({‘ name ‘ : ‘ jim‘, ‘ age ‘ : ‘ 24 ‘});
方法三 XHR2：
HTML5 提供的 XMLHttpRequest Level2 已经实现了跨域访问以及其他的一些新功能，IE10以下的版本都不支持。
在服务器端做一些小小的改造即可：
header(‘ Access-Control-Allow-Origin:* ‘);
header(‘ Access-Control-Allow-Methods:POST, GET ‘);
原文：https://www.cnblogs.com/dhui/p/10605031.html