Ajax全名 : Asynchronous Javascript and XML （异步的javascript和XML）
作用：实现数据交互，可以在无页面刷新的情况下，获取资源
应用：局部刷新、表单的实时验证
代码实现：
1.在html同目录下，保存一个1.txt文件
2.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Ajax</title>
</head>
<body>
<input type="button" id="btn" value="按钮"/>
</body>
<script>
oBtn = document.getElementById("btn");
oBtn.onclick = function () {
var xhr = new XMLHttpRequest(); //1
xhr.open('get', '1.txt', true); //2
xhr.send(); //3
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) { //4
if (xhr.status === 200) { //5
alert(xhr.responseText); //6
} else {
alert('出错了，error：' + xhr.status);
}
}
}
}
</script>
</html>
代码各个部分解析：
1.创建一个ajax对象XMLHttpRequest，后面调用对象方法
2.open方法： 参数 （1）.打开方式 get、post （2）.地址 （3）.是否异步异步：阻塞模式，前面的代码不会阻碍后面代码的执行同步：阻塞模式，前面代码会影响后面代码执行
3.发送请求
4.onreadystatechange：当状态值改变的时候触发
readyState:ajax工作状态:
0 还没有调用open（）方法
1 以调用方法send（），正在发送请求
2 send（）方法完成，已收到全部响应内容
3 正在解析响应内容
4 响应内容解析完成，可以在客户端调用了
5.http状态值，当值为200时，表示请求成功。（http协议）
6.responseText：返回的内容被存放的这个属性下 字符串形式
responseXML：返回的内容被存放的这个属性下 XML形式
open的打开方式：
get：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="1_get.php">
<input type="text" name="username"/>
<input type="text" name="age"/>
<input type="submit" value="submit"/>
</form>
</body>
</html>
<?php header('content-type:text/html;charset="utf-8"'); error_reporting(0); $username = $_GET['username']; $age = $_GET['age']; echo "你的名字：{$username}，年龄：{$age}";
1.把数据名称和数据对应的数据值用等号链接，若果有多项数据，后把数据组合，用 & 链接，然后把数据放到url？后面传到指定页面
数据通过url传递，在php页面更改username和age的数值，刷新，页面也会发生相应改变。
2.因为url长度限制原因，不要通过get方式传递过多的数据。
3.可以被历史纪录，记录下来
4.格式：字符串
5.容易出现的问题：页面的缓存问题，在第二次点击按钮式，不会请求，而会从缓存读取。
可以在url后面加一个时间戳
xhr.open('get', '1_get.php?username=&age=30&'+new Date().getTime(), true);
post：
js
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="button" id="btn" value="按钮"/>
</body>
<script>
oBtn = document.getElementById("btn");
oBtn.onclick = function () {
var xhr = new XMLHttpRequest();
xhr.open('post', '1_post.php', true); //post方式数据放在send（）方法，作为参数传递
xhr.setRequestHeader('content-type','application/x-www-form-urlencoded'); //声明数据发送的编码类型
xhr.send('username=leo&age=30');
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
alert(xhr.responseText);
} else {
alert('出错了，error：' + xhr.status);
}
}
}
}
</script>
</html>
php
<?php header('content-type:text/html;charset="utf-8"'); error_reporting(0); //$_REQUEST $username = $_POST['username']; $age = $_POST['age']; echo "你的名字：{$username}，年龄：{$age}";
1.发送的数据形式一样，但是传输方式不一样
2.理论上无限制
3.通过请求头发送，理论不会被缓存
4.格式有很多，无缓存问题