Ajax入门笔记（原生Ajax、jQuery、axios、fetch、跨域SONP、CORS）

由于篇幅限制，这里只提供原生Ajax和jQuery的示例代码。其他库（axios、fetch）和跨域技术（CORS、SONP）的详细解释和示例将在专题文章中给出。

原生Ajax

// 创建一个新的 XMLHttpRequest 对象
var xhr = new XMLHttpRequest();
 
// 配置请求类型、URL 以及是否异步处理
xhr.open('GET', 'api/some.json', true);
 
// 设置请求完成的回调函数
xhr.onreadystatechange = function () {
  // 请求完成并且响应状态码为 200
  if (xhr.readyState === XMLHttpRequest.DONE) {
    if (xhr.status === 200) {
      // 处理请求响应的数据
      console.log(xhr.responseText);
    } else {
      // 处理错误情况
      console.log('请求失败');
    }
  }
};
 
// 发送请求
xhr.send();

jQuery Ajax

$.ajax({
  url: 'api/some.json',
  type: 'GET',
  dataType: 'json',
  success: function (data) {
    console.log(data);
  },
  error: function () {
    console.log('请求失败');
  }
});

这些示例展示了如何使用原生的XMLHttpRequest对象和jQuery的$.ajax方法来发送GET请求，并在成功获取响应时处理数据。在实际应用中，你可能需要根据具体需求调整HTTP方法、数据类型以及发送的数据。