创建一个原生的Ajax与jsonp封装的Ajax

Posted on

原生:

  • 首先我们要知道什么是Ajax，以及如何创建一个Ajax和他是怎样调用服务的？

    • 创建XMLHTTPRequest 对象
    • 创建一个新的http对象，并指定请求方法类型、验证信息
    • 设置HTTP请求状态变化的回调函数
    • 发送http请求
    • 获取异步调用返回的数据
    • 使用javascript和DOM实现局部刷新
    1
    2
    3
    4
    5
    6
    7
    8
    9
    let xhr = new XMLHttpRequest();
    xhr.open("POST", url, true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded")
    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 304)) {
            fn.call(this.xhr.responseText);
        };
        xhr.send(data);
    }

jsonp:

实现资源跨域访问请求数据

0%