前端后端交互系列之原生Ajax的使用

// 原生Ajax的GET请求示例
function getRequest(url, callback) {
  var xhr = new XMLHttpRequest(); // 初始化一个XMLHttpRequest对象
  xhr.open('GET', url, true); // 设置请求方法和URL
  xhr.onreadystatechange = function () { // 状态改变时的处理函数
    if (xhr.readyState === 4 && xhr.status === 200) { // 请求成功完成
      callback(xhr.responseText); // 调用回调函数处理响应数据
    }
  };
  xhr.send(); // 发送请求
}
 
// 使用getRequest函数发送GET请求
getRequest('https://api.example.com/data', function(response) {
  console.log('收到的数据:', response);
});

这段代码定义了一个getRequest函数，它接受一个URL和一个回调函数作为参数。函数内部使用原生的XMLHttpRequest对象发送GET请求，并在请求成功完成时调用回调函数，将响应数据作为参数传递。这是一个简单的示例，展示了如何使用原生JavaScript进行Ajax请求。