首先，在认识Ajax之前，我们来了解一下同步和异步
在Ajax没被发现之前：有一个很长很多信息要填的表单，有姓名，编号，工作内容，联系方式，地址，邮箱等等，当你填完后，点击提交，等待了好几分钟，它给你返回一个邮箱重复了，你把邮箱改好了之后，再提交，又等了好几分钟，它给你返回联系方式格式错误。—–这就是同步请求：每按一次提交，客户端就发送一次请求（内含你填的信息）给服务器，服务器就返回信息给客户端， 同样是上面的例子，当Ajax出现之后，你填写邮箱的时候，如果重复了，它会提示:邮箱重复，而不用刷新整个页面，这就是异步请求:我们需要改变某一块的内容而不影响其他内容，可以对网页局部的信息进行刷新。
接着，Ajax是什么？
AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。
AJAX 不是新的编程语言，而是一种使用现有标准的新方法。
AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。
我们怎样学习Ajax？
发送Ajax请求需要的技术不多:HTML+CSS把页面做好，利用JS就可以很好地学习Ajax。下面由我们来看看Ajax请求的步骤。
①建立一个Ajax对象
var xmlhttp=new XmlHttpRequest();
②发送请求
xmlhttp.open(method,url,async);其中method是请求方法，分为Get和Post两种。url是接收请求页面的地址，async:true表示异步，false表示同步，默认是true。
然后，GET方法:xmlhttp.send();
POST方法:
xmlhttp.setRequestHeader(“Content-type”,”application/x-www-form-urlencoded”);xmlhttp.send(param);其中param是要传递的参数。POST方法是要设置HTTP请求头的。
③接收响应
xmlhttp.responseText :返回的是String类型，而我们通常是利用JSON来接收的。
④我们怎样判断请求发送成功呢？
readyState:存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪
当请求被发送到服务器时，我们需要执行一些基于响应的任务。
每当 readyState 改变时，就会触发 onreadystatechange 事件。
readyState 属性存有 XMLHttpRequest 的状态信息。
通常我们是这样判断的：
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//code....
}
} 下面我们来看看一个简单的实例
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
function load()
{
var xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","test.txt",true);
xmlhttp.send();
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
}
</script>
<title>Ajax例子</title>
</head>
<body>
<div id="myDiv"><h2>使用 AJAX 获取内容</h2></div>
<button type="button" onclick="load()">获取文档里的内容</button>
</body>
</html>
同目录下的test.txt文件
欢迎来到罗坚元的博客。其实Ajax并没有那么难，上手也是很简单的，但是它还是有很多新鲜的信息需要我们去学习的。上面的只是JS原生的ajax请求代码，而在开发中我们经常利用JS框架来帮助我们更好的写Ajax请求，关于Jquery框架Ajax请求的文章请继续浏览我的博客。
更多精彩内容等待你的浏览—By：罗坚元博客
