AJAX之XMLHttprequest对象

   【概念】      

          XMLHttp对象:xmlhttp提供客户端同http服务器通讯的协议。客户端可以通过xmlhttp对象想http服务器发送请求并使用DOM对象处理回应。其用处是可以更新网页的部分内容而不需要刷新整个页面。

         XMLHttpRequest对象:应用于在后台与服务器交换数据。

 

        XMLHttpRequest对象和其它对象一样,有其自身的属性和方法。

  【属性】

     XMLHttpRequest对象的属性:


  【方法】

     XMLHttpRequest对象的方法:



    【发送请求步骤】

1·既然需要xmlhttprequest对象办事,那就首先需要创建xmlhttprequest对象

2·告诉xmlhttprequest对象:哪个函数会处理该xmlhttprequest对象状态的改变,即将回调函数给xmlhttprequest对象的Onreadystatechange属性赋值

3·指定发送的请求:open()方法

4·将请求发送给服务器:send()方法

5·编写回调函数

 

       【实例分析】

      由于视频教程中提供的实例代码量较多,所以,这里我稍作改动,将第二步和第五步合体实现。

<span style="font-size:18px;"> //测试ajax的xmlhttprequest对象的异步提交方式
        function showHint(str) {
            var xmlhttp;
            if (str.length == 0) {
                document.getElementById("txtHint").innerHTML = "";
                return;
            }
            //第一步:创建xmlhttprequest对象
            if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            }
            else {// code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            //第二步:注册回调方法 并合并回调方法内容
            xmlhttp.onreadystatechange = function () {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
                }
            }
            //指定发送的请求
            xmlhttp.open("GET", "/test/Index?q=" + str, true);
            //将请求发送给服务器
            xmlhttp.send();
        }</span>

       这只是我目前对XMLHttprequest对象的简单认识,至于它是怎么体现“异步”的?和这种“异步”和其它的“同步”方式之间的差别,还在进一步总结中。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 12
    评论
评论 12
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值