自己製作 js ajax 請求類

來源:互聯網
上載者:User

//使用literal文法定義一個對象:XMLHttp  
var XMLHttp =   
{  
    //定義第一個屬性,該屬性用於緩衝XMLHttpRequest對象的數組  
    XMLHttpRequestPool: [],  
    //對象的第一個方法,該方法用於返回一個XMLHttpRequest對象  
    getInstance:function()  
    {  
        // 從XMLHttpRequest對象池中取出一個閒置XMLHttpRequest  
        for (var i = 0; i < this.XMLHttpRequestPool.length; i ++)  
        {  
            //如果XMLHttpReuqest的readyState為0,或者為4,  
            //都表示當前的XMLHttpRequest對象為閑置的對象  
            if (this.XMLHttpRequestPool[i].readyState == 0 ||   
                this.XMLHttpRequestPool[i].readyState == 4)  
            {  
                return this.XMLHttpRequestPool[i];  
            }  
        }  
        //如果沒有閒置,將再次建立一個新的XMLHttpRequest對象  
        this.XMLHttpRequestPool[this.XMLHttpRequestPool.length]   
            = this.createXMLHttpRequest();  
        //返回剛剛建立的XMLHttpRequest對象  
        return this.XMLHttpRequestPool[this.XMLHttpRequestPool.length - 1];  
    },  
    //建立新的XMLHttpRequest對象  
    createXMLHttpRequest:function()  
    {  
        //對於DOM 2 規範的瀏覽器  
        if (window.XMLHttpRequest)  
        {  
            var objXMLHttp = new XMLHttpRequest();  
        }  
        //對於Internet Explorer瀏覽器  
        else 
        {  
            //將Internet Explorer內建的所有XMLHTTP ActiveX控制設定成數組  
            var MSXML = ['MSXML2.XMLHTTP.5.0', 'MSXML2.XMLHTTP.4.0',   
                'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP', 'Microsoft.XMLHTTP'];  
            //依次對Internet Explorer內建的XMLHTTP控制項初始化,嘗試建立XMLHttpRequest對象  
            for(var n = 0; n < MSXML.length; n ++)  
            {  
                try 
                {  
                    //如果可以正常建立XMLHttpRequest對象,使用break跳出迴圈  
                    var objXMLHttp = new ActiveXObject(MSXML[n]);   
                    break;  
                }  
                catch(e)  
                {  
                }  
            }  
        }  
        //Mozilla某些版本沒有readyState屬性  
        if (objXMLHttp.readyState == null)  
        {  
            //直接設定其readyState為0  
            objXMLHttp.readyState = 0;  
            //對於哪些沒有readyState屬性的瀏覽器,將load動作與下面的函數關聯起來  
            objXMLHttp.addEventListener("load", function ()  
            {  
                //當從伺服器載入資料完成後,將readyState狀態設為4  
                objXMLHttp.readyState = 4;  
                if (typeof objXMLHttp.onreadystatechange == "function")  
                {  
                    objXMLHttp.onreadystatechange();  
                }  
            }, false);  
        }  
        return objXMLHttp;  
    },  
    //定義對象的第三個方法: 發送請求(方法[POST,GET], 地址, 資料, 回呼函數)  
    sendRequest: function (method, url, data, callback)  
    {  
        var objXMLHttp = this.getInstance();  
        with(objXMLHttp)  
        {  
            try 
            {  
                //增加一個額外的randnum請求參數,用於防止IE快取服務器響應  
                if (url.indexOf("?") > 0)  
                {  
                    url += "&randnum=" + Math.random();  
                }  
                else 
                {  
                    url += "?randnum=" + Math.random();  
                }  
                //開啟與伺服器的串連  
                open(method, url, true);  
                //對於使用POST請求方式  
                if (method == "POST")  
                {  
                    // 設定要求標頭  
                    setRequestHeader('Content-Type',   
                        'application/x-www-form-urlencoded');  
                    send(data);  
                }  
                //對於採用GET請求  
                if (method == "GET")  
                {  
                    send(null);  
                }  
                //設定狀態改變的回呼函數  
                onreadystatechange = function ()  
                {  
                    //當伺服器的相應完成時,以及獲得了正常的伺服器響應  
                    if (objXMLHttp.readyState == 4 &&  
                        (objXMLHttp.status == 200 ||   
                            objXMLHttp.status == 304))  
                    {  
                        //當響應時機成熟時,調用回呼函數處理響應  
                        callback(objXMLHttp);  
                    }  
                }  
            }  
            catch(e)  
            {  
                alert(e);  
            }  
        }  
    }  
};

摘自 Hurry的專欄

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.