Ajax学习笔记（一）

看那些前端招聘简章中我们多多少少能看到一个身影——ajax,他成为了前端工作者必备的一项技能要求。那什么是Ajax呢？

Ajax 全称是 asynchronous javascript and xml（asynchronous=异步），并不是新的编程语言，可以说是已有技术的组合，主要用来实现客户端与服务器端的异步通信效果，在不需要重新加载整个网页的情况下，实现页面的局部刷新，从而创建快速动态网页的技术。

Ajax创建过程

1.创建XMLHttpRequest对象，即创建一个异步调用对象；

var xmlhttp=new XMLHttpRequest();//所有现代浏览器（IE7+、Firefox、Chrome、Safari 以及 Opera）均内建 XMLHttpRequest 对象。

var xmlhttp=new  ActiveXObject("Microsoft.XMLHttp");//老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象：

//兼容性写法
var xmlhttp;
if (window.XMLHttpRequest) {
 // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 
xmlhttp=new XMLHttpRequest();
 } else {
 // IE6, IE5 浏览器执行代码
 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }

2.创建一个新的HTTP请求，并指定其请求的方法（GET与POST）、URL及验证信息

xmlhttp.open("method"，"URL"，async)；

/*

method:请求类型；GET或POST；
URL:文件在服务器上的位置；
async：true(异步)或false(同步)；

*/

3.设置响应HTTP请求状态变化的函数

xmlhttp.responseText;//获得字符串形式的响应数据
xmlhttp.responseXML;//获得XML形式的响应数据

4.发送HTTP请求

xmlhttp.send();

//send(string)：将请求发送到服务器。string仅用于post请求

5.获取异步调用返回的数据

//数据是否成功请求，通过onreadystatechange事件来判定，当readyState改变时触发函数
xmlhttp.onreadystatechange=function() { 
if (xmlhttp.readyState==4 && xmlhttp.status==200) 
　　{
 　　　　document.getElementById("myDiv").innerHTML=xmlhttp.responseText; 
　　} 
}
/*
readyState:
0:请求未初始化
1.服务器连接已建立
2：请求已接受
3：请求处理中
4:请求已完成，且响应已就绪
Status:
200：ok;
404："未找到页面"
*/