Ajax知识体系大梳理

Ajax（Asynchronous JavaScript and XML）技术是一种在网页中实现异步数据交换的方法。它可以在不重新加载整个网页的情况下，与服务器交换数据并更新网页的部分内容。

以下是Ajax的基本概念和使用示例：

1. XMLHttpRequest对象：Ajax的核心对象，用于发送异步的http请求。

var xhr = new XMLHttpRequest();
xhr.open('GET', 'url', true);
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 && xhr.status == 200) {
        // 请求成功
        var response = xhr.responseText;
    }
};
xhr.send();

2. jQuery中的Ajax：对XMLHttpRequest进行了封装，提供了更简便的接口。

$.ajax({
    url: 'url',
    type: 'GET',
    success: function(response) {
        // 请求成功
    },
    error: function() {
        // 请求失败
    }
});

3. JSONP：一种跨域请求数据的方式，通过动态添加<script>标签实现。

function jsonpCallback(data) {
    // 处理data
}
var script = document.createElement('script');
script.src = 'http://example.com/jsonp?callback=jsonpCallback';
document.body.appendChild(script);

4. fetch API：是现代浏览器提供的新的Ajax解决方案，基于Promise设计。

fetch('url')
    .then(response => response.json())
    .then(data => {
        // 处理data
    })
    .catch(error => {
        // 处理错误
    });

以上是Ajax的基本概念和使用示例，实际应用中还需要注意跨域问题、错误处理等。