javascript

今天，我们理解一项比较火爆的技术。它能在我们需要加载局部页面更新数据时，或者是需要大量的局部数据刷新或加载。不必重新加载整个页面，为客户提升了网上的体验。这就是AJAX 技术。

在此之前，用户点击了某个链接，请求发送回服务器，然后服务器根据用户的操作再返回新的页面，即使用户操作的是局部的页面的时候，页面也要重新的加载一遍。这就增加了用户的重复的操作。我们就可以用AJAX技术来操作。它的主要的优势是，对页面的请求是以异步的方式发送服务器，而服务器不会用整个页面来响应请求，它会以异步的方式来处理响应，而用户还可以继续和页面操作交互。你的脚本则可以按需加载和创建页面内容，而不会打断用户的浏览体验了。我们会有goole地图的感觉。

首先，AJAX的运行环境是依赖于js的。也就是写在js当中的。通过是js来驱动。这是AJAX的使用范围。

AJAX的核心技术是XMLHttpRequest对象的，所以，我们想用AJAX技术，先必须创建XMLHttpRequest对象。用 new XMLHttpRequest (); 的构造函数的方式来创建一个AJAX的对象实例，完整的创建方式如下：

var xhr  = new XMLHttpRequest();

这样，就创建了一个xhr的对象实例了。

然后，由于AJAX的兼用要覆盖ie版本，所以，我们要写兼容模式，兼容模式有几下写法：

function checkXmlhttp() {

if(typeof XMLHttpRequest == "undefined")// 花括号 省略了 如果XMLHttpRequest的类型是undefined 的 那么就执行ie的类型兼容。

window.XMLHttpRequest = function () {

try{

return new ActiveXObject("Msxml2.XMLHTTP.6.0");

}catch (err){};

try{

return new ActiveXObject("Msxml2.XMLHTTP.3.0");

}catch (err) {};

try{

return new ActiveXObject ("Msxml2.XMLHTTP");

}catch(err) {};

return false;

}

return new XMLHttpRequest();

}

var xhr = checkXmlhttp(); //调用这个函数 就拿到这个函数返回值了。

这个是兼容写法的比较复杂的情况。有一种简单的写法，我们经常用。

// 简单的写法：运用三目运算法来做判断。

var xhr = window.XMLHttpRequest ? new XMLHttpRequest（） : new ActiveXObject("Microsoft.XMLHTTP");

然后下一步是配置请求 最重要的方法是：open(); 有三个参数：第一个参数是：请求方式：GET/POST  一般默认的是：GET的请求方式。第二个参数是：接口的地址路径。相对路径和绝对路径。(接口的路径就是我们请求服务器的链条，我们一般用的绝对路径，首先是，http/https// 这是安全协议，然后是域名（或者是ip地址）然后是端口，有的默认不写。这些就确定了接口的具体位置，端口是指服务器的不同功能。不同的功能有不同的端口号。通过这些要素，来确定接口的链条，我们可以通过接口链来向服务器请求数据的。) 举个实例：

xhr.open("GET","http://wthrcdn.etouch.cn/weather_mini?city=北京",true)

// 发送请求。用send（）方法，

xhr.send(null);

// 监听数据请求状态。用到的是onreadystatechange 监听事件。它的值在不同阶段有不同的含义。如下所示：

0：请求未初始化

1：服务器器连接已建立

2：请求已接收

3：请求处理理中

4：请求已完成，且响应已就绪

xhr.onreadystatechange = function () {

if(xhr.readyState == 4 && xhr.status ==200){

alert(xhr.responseText);

}

}

以上完成了 AJAX的请求。