笔记练习：《Javascript入门经典（第5版）》page212_17.7Practice

尝试修改程序清单 17.3 和 17.4 的代码，在等待 Ajax 请求完成相应的过程中，给用户提示一些信息。

这个库目前在错误检测与处理方面还是很弱的，尝试对其进行修改，从而对于 req.status 不等于200 时的状态做出适当的处理。

修改 “myAjaxLib.js“ JS 文件，代码内容如下：

function getXMLHttpRequest(){
    try {
        try {
            return new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch(e) {
            return new ActiveXObject("Msxml2.XMLHTTP");
        }
    }
    catch(e) {
        return new XMLHttpRequest();
    }
}

function doAjax(url, query, callback, reqtype, getxml){
    var myreq = getXMLHttpRequest();
    myreq.onreadystatechange = function(){
        //等待 Ajax 请求完成响应的提示
        var newText = '';
        if(myreq.readyState != 4){
            if(myreq.status != 200){
                newText = document.createTextNode("\n加载中……");
                document.body.appendChild(newText);
            }
        }
        if(myreq.readyState == 4){
            if(myreq.status == 200){
                var item = myreq.responseText;
                if(getxml == 1) item == myreq.responseXML;
                eval(callback + '(item)');
                //完成 Ajax 请求完成响应的提示
                newText = document.createTextNode("处理完成");
                document.body.appendChild(newText);
            } else alert("检查到错误，数据处理失败‘req.status 不等于 200’");
        }
    }
    if(reqtype.toUpperCase() == "POST"){
        requestPOST(url, query, myreq);
    }else{
        requestGET(url, query, myreq);
    }
}

function requestGET(url, query, req){
    var myRandom = parseInt(Math.random() * 99999999);
    if(query == ''){
        var callUrl = url + '?rand=' + myRandom;
    }else{
        var callUrl = url + '?' + query + '&rand=' + myRandom;
    }
    req.open("GET", callUrl,true);
    req.send(null);
}

function requestPOST(url, query, req){
    req.open("POST", url, true);
    req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    req.send(query);
}

测试结果：

图1 清单17.2测试结果

图2 清单17.3提交请求，等待响应过程

图3 清单17.3测试结果