JS--AJAX基础、获取Ajax引擎对象、解决XMLHttpRequest兼容问题

AJAX

AJX即（asynchronous Javascript And XML）异步JavaScript和XML，可以使网页实现异步更新，就是不重新加载整个页面的情况下，对网页的某部分进行更新（局部刷新）。传统的网页如果需要更新内容，必须重载整个网页页面。

XMLHttpRequest是JavaScript一个外挂组件，用来实现客户端与服务器端异步通信，所有Ajax应用都要借助该组件才能够实现。目前各大主流浏览器都支持XMLHttpRequest组件。

定义XMLHttpRequest对象

使用XMLHttpRequest对象实现异步通信一般需要下面几个步骤：

• 定义XMLHttpRequest实例对象
• 调用XMLHttpRequest对象的open()方法打开服务器端URL地址
• 注册onreadystatechange事件处理函数。准备接收响应数据、并进行处理
• 调用XMLHttpRequest对象的send()方法发送请求

IE在5.0 版本开始就以ActiveX组件的形式定义了XMLHttpRequest对象，在7.0 版本中标准化XMLHttpRequest对象，允许通过window对象进行访问。现代标准浏览器都支持XMLHttpRequest对象，虽然早期IE浏览器以ActiveX组件形式支持，但是所有浏览器的XMLHttpRequest对象都提供了相同的属性和方法。

使用工厂模式对XMLHttpRequest的获取进行封装，解决兼容性问题：

<script>
   function createXMLHTTPObject() {
        var XMLHttpFactories = [//兼容不同浏览器和版本的创建函数数组
            function () {return new XMLHttpRequest()},
            function () {return new ActiveXObject("Msxml2.XMLHTTP")},
            function () {return new ActiveXObject("Msxml3.XMLHTTP")},
            function () {return new ActiveXObject("Microsoft.XMLHTTP")}
         ];
        var xmlhttp = false;
        for(var i = 0; i < XMLHttpFactories.length; i++){
            //尝试调用匿名函数，如果成功则返回XMLHttpRequest对象，否则继续调用下一个
            try{
                xmlhttp = XMLHttpFactories[i]();
            }catch (e) {
                continue;
            }
            break;
        }
        return xmlhttp;
    }
</script>

上面的函数首先创建一个数组，数组元素为各种创建XMLHttpRequest对象的匿名函数。第一个元素是创建一个本地对象，而其他元素将针对IE浏览器的不同版本尝试创建ActiveX对象。然后设置变脸xmlhttp为false，表示不支持Ajax。接着遍历工厂内所有函数并尝试执行它们，为了避免发生异常，把所有调用函数放在try子句中执行，如果发生错误，则在catch子句中捕获异常，并执行continue语句，返回继续执行，而不是抛出异常。如果创建成功，则终止循环，返回创建的XMLHttpRequest对象实例。