无框架的javascript-ajax请求

有人知道如何使ajax请求功能在不使用jQuery等javascript框架的情况下跨浏览器工作吗

使用

XMLHttpRequest

对象实际上并不那么复杂。为了实现广泛的兼容性，您必须玩一些游戏来创建对象，但是在这之后，对于简单的操作就相当简单了

Microsoft在上有一些示例，其中包括一个以跨浏览器方式创建对象的功能，该功能支持早期版本的IE。下面是他们的示例：

function getXMLHttpRequest() 
{
    if (window.XMLHttpRequest) {
        return new window.XMLHttpRequest;
    }
    else {
        try {
            return new ActiveXObject("MSXML2.XMLHTTP.3.0");
        }
        catch(ex) {
            return null;
        }
    }
}

function handler()
{
    if (oReq.readyState == 4 /* complete */) {
        if (oReq.status == 200) {
            alert(oReq.responseText);
        }
    }
}

var oReq = getXMLHttpRequest();

if (oReq != null) {
    oReq.open("GET", "http://localhost/test.xml", true);
    oReq.onreadystatechange = handler;
    oReq.send();
}
else {
    window.alert("AJAX (XMLHTTP) not supported.");
}

---

我并不是说上面的例子是最佳实践（微软的MSDN示例似乎主要由非常、非常缺乏经验的工程师编写），但它为您提供了一个起点。例如，上面要求响应状态为200表示成功，当然HTTP规范明确指出，在现代浏览器中，200我经常使用此方法发送和接收json（没有旧ie）

---

我想它在网上到处都是。我不敢提及W3学校，但这是谷歌的第一个结果！！搜索我正在尝试制作可嵌入的js代码，所以它需要小巧和可移植“还有，试试谷歌。”嘿，这就是我为什么来到这里的原因。我想它成功了！实际上，每个教程都在使用某种框架，通常是JQuery。我不想仅仅为了一个简单的AJAX请求就包含整个库+1.实际上，微软需要提高MSDN示例中使用的代码的质量，但这是一个很好的起点。

function aj(method, url, data, cb){

    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = readystatechange;
    xhr.open(method, url);
    xhr.setRequestHeader('Content-Type', 'application/json');
    xhr.send(data && JSON.stringify(data));

    function readystatechange(){
        if(this.readyState === this.DONE) {

            switch(this.status){
                case 200:
                if(this.getResponseHeader('Content-Type').split(';')[0] !== 'application/json'){
                    return cb("unexpected Content-Type: '" + this.getResponseHeader('Content-Type') + "'", null);
                }
                return cb(null, JSON.parse(this.response));

                case 401:
                location.href = '/authentication/login';
                return;

                default:
                return cb("unexpected status: " + this.status + "", null);
            }
        }
    }//readystatechange
}