有必要搞得那么清楚吗,明白什么代码起封装兼容哪类浏览器的功能,生成相应的XMLHTTP对象就足够了.
像JQUERY这类的都是封装好的,你连考虑这些都不要考虑.

解决方案 »

  1.   

    XMLHttpRequest
    本书提到的许多hack的核心就是XMLHttpRequest对象,它允许JavaScript在从服务器获取数据的同时,不影响用户开心地处理页面的其他部分。我们将在下文概括地介绍这个对象的API。下面的列表显示了request对象所具有的属性。
    onreadystatechange
    回调函数;只要readyState发生了变化,被赋给这个属性的函数后就会被调用。
    readystate
    数值;0表示未初始化,open()函数还没有被调用;1表示正在载入,send()函数还没有被调用;2表示已载入,send()函数已被调用,并且headers/status已经可用;3表示正在交互,responseText已经含有部分数据;4表示已完成。
    responseText
    字符串;响应的纯文本。
    ResponseXML
    DOM文档对象;作为返回值的XML
    status
    响应状态码,比如200(OK)或404(未找到)。
    statusText
    字符串;与Http响应状态相关的文本。
    request对象所支持的方法如下。
    abort()
    void:取消Http请求。
    getAllResponseHeaders()
    字符串;以预定义格式的字符串形式返回所有的响应首部
    getResponseHeader(string header)
    字符串;返回某个特定首部的值。
    open(string url,string asynch)
    void;准备HTTP请求并指明它是否为异步的。
    send(string)
    void;发送HTTP请求。
    setRequestHeader(string header,string value)
    void:设置请求首部,但必须先调用open()函数。
      

  2.   

    上楼和下楼均摘自  AJAX HACKS  一书:
    完整的兼容性检查的示例:
    /*构建一个Request对象的封装函数
    参数:
    reqType:HTTP请求类型,例如GET或POST。
    url:服务器端程序的URL
    asynch:是否异步发送请求*/function httpRequest(reqType,url,asynch){
        //基于Mozilla的浏览器
        if(window.XMLHttpRequest){
           request=new XMLHttpRequest();
        }else if (window.ActiveXObject){
          request=new ActiveXObject)("Msxml2.XMLHttp");
          if(!request){
              request=new ActiveXObject("Microsoft.XMLHTTP");
          }
         }
         //如果ActiveXObject初始化也不成功,request应该仍是null
         if(request){
              initReq(reqType,url,asynch);
         }else{
            alert("your browser does not permit the use of all "+
                  "of this application's features!");
         }
    }
    /*初始化已经创建的request对象*/
    function  initRequest(reqType,url,bool){
        /*指定处理HTTP响应的函数*/
        request.onreadystatechange=handleResponse;
        request.open(reqType,url,bool);
        request.send(null);
    }
    提示:作为一个替代方案,你可以使用开源类库Prototype,该库用面向对象的JavaScript将request对象包装成自己对象Ajax.Request(参见第6章)
         
      

  3.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/1999/REC-html401-19991224/strict.dtd">
    <html>
    <head>
         <script type="text/javascript" src="/parkerriver/js/hack2.js"></script>
         <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
         <title>Send a data tidbit</title>
    </head>
    <body>
    <h3>A few facts about yourself...</h3>
    <form action="javascript:void%200" onsubmit="sendData();return false">
          <p>First name:<input type="text" name="firstname" size="20"></p>
          <p>Last name:<input type="text" name="lastname" size="20"></p>
          <p>Gender:<input type="text" name="gender" size="20"></p>
          <p>Country of origin:<input type="text" name="country" size="20"></p>
          <p><button type="submit">send data</button></p>
    </form>
    </body>
    </html>
    =========================
    提示:你或许会对form action="javascript:void%200"语句感到奇怪。因为我们在表单被提交时调用Javascript函数,但我们只想给action属性设置一个没有返回值的JavaScript URL,如“javascript:void 0".我们必须为void和0之间的空格编码,这就是%20的来历。如果用户浏览器禁用了Javascript,点击表单上的提交按钮将不起任何作用,因为action属性没有指向一个有效的URL。此外,如果你使用action="",某些HTML浏览器会给出警告。写这段代码的另一种方式是在Javascript.js文件里,将函数调用包含在window.onload事件处理器中,这也是本书中大多数hack所采取的做法。
    =========================
    function setQueryString(){
         QueryString="";
         var frm=document.forms[0];
         var numberElements=frm.elements.length;
         for(var i=0;i<numberElements;i++){
            if(i<numberElements-1){
               queryString+=frm.elements[i].name+"="+
                            encodeURIComponent(frm.elements[i].value)+"&";
            }else{
               queryString+=frm.elements[i].name+"="+
                          encodeURIComponent(frm.elements[i].value);
            }
          }
    }
    =======
    Firstname=Bruce&lastname=Perry&gender=M&country=USA
    ===========================================================================
    下面是核心部分  sendData()函数
    var request
    var queryString;     //将放置POSTed的数据
    function sendData(){
         setQueryString();
         var url="http://www.parkerriver.com/s/sender";
         httpRequest("post",url,true);
    }
    /*初始化一个已经创建的Request对象
    参数:
       reqType:HTTP请求类型,如GET或POST,
       url:服务器端程序的URL
       isAsynch:是否异步发送请求。*/
    function initReq(reqType,url,isAsynch){
        /*指定将处理HTTP响应的函数*/
        request.onreadystatechange=handleResponse;
        request.open(reqType,url,isAsynch);
        /*为POST请求设定Content-Type头*/
        request.setRequestHeader("Content-Type",
                "application/x-www-form-urlencode;charset=UTF-8");
        request.send(queryString);
    }/*构建Request对象的封装函数
    参数:
     reqType:HTTP请求类型,如GET或POST.
     url:服务器端程序的URL
     asynch:是否异步发送请求:*/function httpRequest(reqType,url,asynch){
      //基于Mozilla的浏览器
      if(window.XMLHttpRequest){
        ...略
    }//XMLHttpRequest的事件处理器
    function handleResponse(){
      if(request.readyState==4){
           if(request.status==200){
               alert(request.responseText);
           }else{
             alert("A problem occurred with communicating between"+
                   "the XMLHttpRequest object and the server program.");
           }//外层if结束
    }