XMLHttpRequest对象的创建

绝地灬酷狼 2022-08-13 14:56 179阅读 0赞

首先先介绍一下XMLHttpRequest对象，我们都知道Ajax它并不是单单一门技术，而是几种技术的融合。XMLHttpRequest是Ajax技术体系中最为核心的技术，如果没有XMLHttpRequest，Ajax的其余技术就无法成为一个有机的整体。在Ajax应用程序中XMLHttpRequest对象负责将用户信息以异步方式发送到服务器，并接收服务器返回的响应信息和数据。

XMLHttpRequest时XMLHttp组件的一个对象，使用XMLHttpRequest可以实现不向服务器提交整个页面的情况下，局部更新网页信息。可能这么说有点抽象吧，大家都经常进QQ空间看好友动态，有些好友分享了视频，我们点击播放之后无论是在视频缓冲期间还是在播放期间鼠标跟键盘都没有丧失活动能力，我们可以继续浏览其他动态，而我们在上下滑动鼠标滚轮的时候，视频页面也跟随我们浏览的当前位置上下移动，如下图所示，这样的功能就可以通过Ajax实现。

![Center][]

XMLHttpRequest对象提供了一系列的属性和方法来向服务器发送异步HTTP请求。在服务器处理用户请求的过程中，XMLHttpRequest对象通过属性的状态值来实时反映HTTP请求所处的状态并根据得到的状态指导javascript做相应的处理。此外当服务器顺利响应用户动作并将用户返回时，XMLHttpRequest提供的response系列方法可以将返回的数据组装成文本格式、XML格式或者unsigned byte数据格式提供的javascript脚本处理。

使用XMLHttpRequest对象发送请求和处理响应之前，必须要使用javascript创建XMLHttpRequest对象。由于XMLHttpRequest对象目前还不是W3C标准，所以在新版本IE浏览器、旧版本IE浏览器以及非IE浏览器中的创建方法也不同。因此在创建XMLHttpRequest对象之前需要先判断浏览器的类型。对于版本较低的IE浏览器需要使用Microsoft.XMLHTTP，而对于版本较高的IE浏览器需使用Msxml2.XMLHTTP。

下面是创建XMLHttpRequest对象的代码：

<span style="font-family:KaiTi_GB2312;font-size:18px;">    <script language="javascript" type="text/javascript">
            var xmlHttp;
            //使用新版本的IE创建XMLHttpRequest对象
            try {
                xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                //使用旧版本的IE创建XMLHttpRequest对象
                try {
                    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (E) {}
            }
            //使用其他浏览器创建XMLHttpRequest对象
            if (!xmlHttp && typeof XMLHttpRequest !='undefined') {
                try{
                    xmlHttp=new XMLHttpRequest();
                } catch (e) {
                    xmlHttp = false;
                }
            }
        </script></span>

从代码中我们可以看出，虽然需要进行逻辑判断，但是创建XMLHttpRequest对象并不复杂。自己对于XMLHttpRequest的理解也不是很透彻，只是根据视频中的实例和Ajax编程技术课本中的知识进行了整理，希望大家可以多多交流，共同进步。

[Center]: /images/20220810/e273879932ae4f2aac813ae2f7b9cf4b.png