封装ajax请求--get,post（前端 js 封装ajax请求，浏览器兼容）

最新推荐文章于 2024-06-09 10:45:00 发布

原创最新推荐文章于 2024-06-09 10:45:00 发布 · 253 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#ajax

ajax 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一个简单的AJAX函数实现，包括GET和POST请求的处理，以及跨浏览器兼容性解决方案。函数通过判断浏览器类型选择合适的XMLHttpRequest对象，根据不同请求类型设置URL参数，处理请求头，并在请求完成后执行回调函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

function ajax(opt) {

    var xhr = null;
    
    var param = Change(opt);

    // 兼容

    if (window.XMLHttpRequest) {

        xhr = new XMLHttpRequest();

    } else {

        xhr = new ActiveXObject('Micosoft.XMLHttp');

    }

    // 连接判断 get--post

    if (opt.type == "GET") {

        xhr.open(GET, opt.url + '?' + param, opt.async);

        xhr.send(null);

    } else if (opt.type == "POST") {

        xhr.open(POST, opt.url, opt.async);

        xhr.setRequestHeader("Content-Type", 'application/x-www-form-urlencoded');

        xhr.send(param);

    }

    // 状态判断 并发送

    xhr.onreadystatechange = function() {

        if (xhr.readyState == 4 && xhr.status == 200) {

            opt.success(xhr.responseText);

        }

    }

    // 数据处理

    function Change(data) {

        var arr = [];

        for (var p in data) {

            arr.push(p+ "=" + data[p]);

        }

        return arr.join("&");

    }

}