原生js的AJAX

和jQuery的$.ajax()的效果是一样一样哒!

//原生AJAX
var fxAJAX = function (el) {
    //el :初始化 参数
    //get请求方式会产生缓存，post请求方式则没有。。。
    var el = {
        url: el.url,//必填
        type: el.type == undefined ? "get" : el.type,//string 可选，默认为"get"
        data: el.data == undefined ? null : el.data,//可选，默认为空，只有type==post请求的的时候需要, user=user&name=name....
        dataType: el.dataType == undefined ? "text" : el.dataType,//string 可选，默认为“text”
        success: el.success//可选，回调函数
    };
    //创建XMLHttpRequest对象
    var xmlHttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
    //传参数，打开对象
    xmlHttp.open(el.type, el.url, true);
    //选择发送方式
    //因为get请求的参数是在url里，所以send(null);
    el.type.toString().toLocaleLowerCase() == "get" ? xmlHttp.send(null) : xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xmlHttp.send(el.data);
    //if (el.type.toString().toLocaleLowerCase() == "get") { xmlHttp.send(null) } else { xmlHttp.send(el.data) }
    xmlHttp.onreadystatechange = function () {
        if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
            if (el.dataType.toString().toUpperCase() == "TEXT") {
                //普通文本
                if (el.success != null) { el.success(xmlHttp.responseText); }
            } else if (el.dataType.toString().toUpperCase() == "XML") {
                //接收xml文档
                if (el.success != null) { el.success(xmlHttp.responseXML); }
            } else if (el.dataType.toString().toUpperCase() == "JSON") {
                //将josn字符串转换为js对象
                if (el.success != null) { el.success(eval("(" + xmlHttp.responseText + ")")); }
            }
        }
    }
}

 如何调用？

fxAJAX({
    url: "?action=del",
    type: "post",
    data: "Id=" + id,
    success: function (msg) {//执行成功之后运行到这里
        //console.log('成功')!
    }
});