如何写一个jQuery Ajax

首先看一看基本的jQuery Ajax的调用

$.ajax({
    method: 'POST',
    url: 'test.php',
    data: {
        name1: 'value1',
        name2: 'value2'
    },
    success: function (response) {
        console.log(response)；
    }
});

嗯！大概就是这么个熊样

首先，我们这个$.ajax();的参数，没错这是一个对象
预定义用户收入的参数，然后解析每一个参数，并且返回所需要的数据

var ajax = function(param){
        param        = param || {};
        param.method = param.method.toUpperCase() || "POST";
        param.url    = param.url  || "";
        param.async  = param.async|| true;
        param.data   = param.data || null;
        param.success= param.success || function(){};
        var xhr = null;
        if(window.XMLHttpRequest)
        {
            xhr = new XMLHttpRequest();
        }
        else
        {
            // 出自微软官方,不适用自己调
            xhr = new ActiveXObject("MSXML2.XMLHTTP.3.0");
        }
        var params = [];
        for (var key in param.data)
        {
            params.push(key+'='+param.data[key]);
        }
        var postData = params.join('&');
        if(param.method.toUpperCase()==='POST')
        {
            xhr.open(param.method,param.url,param.async);
            xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded;charset=utf-8');
            xhr.send(postData);
        }
        else if(param.method.toUpperCase()==='GET')
        {
            xhr.open(param.method,param.url + '?' + postData, param.async);
            xhr.send(null);
        }
        xhr.onreadystatechange = function ()
        {
            if(xhr.readyState == 4 && xhr.status == 200)
            {
                param.success(xhr.responseText);
            }
        }
    }

调用

ajax({
    method: 'POST',
    url: 'test.php',
    data: {
        name1: 'value1',
        name2: 'value2'
    },
    success: function (data) {
        console.log(data)；
    }
});

看！是不是一样色的

本文参考无数（不能说我厚颜），有啥疑问可以提出！大咖，大佬不要调侃