Ajax 学习笔记

发布时间：2020-12-15 22:08:11 所属栏目：百科来源：网络整理

导读：Ajax 学习笔记 from 《javascript高级程序设计第二版》 For IE browser function createXHR(){ if (typeof XMLHttpRequest != “undefined”){ return new XMLHttpRequest(); } else if (typeof ActiveXObject != “undefined”){ if (typeof arguments.call

Ajax 学习笔记
from 《javascript高级程序设计第二版》
For IE browser

function createXHR(){
    if (typeof XMLHttpRequest != “undefined”){
        return new XMLHttpRequest();
    } else if (typeof ActiveXObject != “undefined”){
        if (typeof arguments.callee.activeXString != “string”){
            var versions = [“MSXML2.XMLHttp.6.0”,“MSXML2.XMLHttp.3.0”,“MSXML2.XMLHttp”];
    
            for (var i=0,len=versions.length; i  <  len; i++){
                try {
                    var xhr = new ActiveXObject(versions[i]);
                     arguments.callee.activeXString = versions[i];
                    return xhr;
                } catch (ex){
                    //skip
                }
            }
        }
        return new ActiveXObject(arguments.callee.activeXString);
    } else {
        throw new Error(“No XHR object available.”);
    }
}
xhr =  createXHR();
xhr.open("get","text.php",false);   //request Type: get or post and so on,URL,asynchronously or not,true for Asy.

responseText — The text that was returned as the body of the response
responseXML — Contains an XML DOM document with the response data if the response has a content type of “ text/xml ” or “ application/xml ”status — The HTTP status of the response // status code,eg: 200 for OK,304 for resource hasn't been modified....
statusText — The description of the HTTP status
readyState:
0 -- Uninitialized. open() can't be called
1 -- open,not send() call
2 -- sent,no response has been received
3 -- receiving
4 -- complete
onreadystateChange event

var xhr = createXHR();        
xhr.onreadystatechange = function(){
    if (xhr.readyState == 4){
        if ((xhr.status == 200) || xhr.status == 304){
            alert(xhr.responseText);
        } else {
            alert(“Request was unsuccessful: “ + xhr.status);
        }
    }
};
xhr.open(“get”,“test.txt”,true);
xhr.send(null);   //if the argument is null,it can't be igored.

//========================
HTTP Headers
Accept — The content types that the browser can handle.
Accept - Charset — The character sets that the browser can display.
Accept - Encoding — The compression encodings handled by the browse
Accept - Language — The languages the browser is running in.
Connection — The type of connection the browser is making with the server.
Cookie — Any cookies set on the page.
Host — The domain of the page making the request.
Referer — The URI of the page making the request. Note that this header is spelled incorrectly in the HTTP specification and so must be spelled incorrectly for compatibility purposes (the correct spelling of this word is “ referrer “ ).
User - Agent — The browser ’ s user - agent string.

xhr.setRequestHeader(headerName,headerValue); //must be called before send but after open
getRequestHeader();
getAllRequestHeaders();

In IE
timeout property
ontimeout event;
xhr.timeout = 1000; // 1s
xhr.ontimeout = function() {}

In Firefox
load == readystatechange
xhr.onload = function(e) {}
onprogress evnet handler
position: the number of bytes that have been received
totalSize: total number of excepted bytes

XDR (XML domain request)
Access-Control-Allow-Origin:
XDR存在浏览器兼容性问题。

from javascript设计模式

单例化模式的产生XHR，对兼容性只做一次性检查。

//get XMLHttpRequest Object
//SimpleXhrFactory.createXhrObject();
var SimpleXhrFactory = (function(){
    var standard = {
        createXhrObject: function(){
            return new XMLHttpRequest();
        }
    };
    var activeXNew = {
        createXhrObject: function(){
            return new ActiveXObject("Msxml2.XMLHTTP");
        }
    };
    var activeXOld = {
        createXhrObject: function(){
            return new ActiveXObject("Microsoft.XMLHTTP");
        }
    }
    
    var testObject;
    try {
        testObject = standard.createXhrObject();
        return standard;
    } 
    catch (e) {
        try {
            testObject = activeXNew.createXhrObject();
            return activeXNew;
        } 
        catch (e) {
            try {
                testObject = activeXOld.createXhrObject();
                return activeXOld;
            } 
            catch (e) {
                throw new Error("No XHR Object found in this environment");
            }
        }
    }
})();

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!