【学习笔记77】ajax的函数封装

在JavaScript中，可以创建一个简单的函数来封装AJAX调用。以下是一个示例函数，它使用原生的JavaScript XMLHttpRequest 对象来发送AJAX请求：

function ajax(method, url, data, callback) {
  var xhr = new XMLHttpRequest();
  xhr.open(method, url, true);
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      callback(xhr.responseText);
    }
  };
  if (method === 'POST') {
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.send(data);
  } else {
    xhr.send();
  }
}
 
// 使用示例
ajax('GET', 'https://api.example.com/data', null, function(response) {
  console.log('Response:', response);
});
 
ajax('POST', 'https://api.example.com/data', 'key1=value1&key2=value2', function(response) {
  console.log('Response:', response);
});

这个 ajax 函数接受四个参数：method（HTTP方法，如'GET'或'POST'），url（请求的URL），data（如果是POST请求，发送的数据），以及 callback（请求成功完成时调用的函数）。函数内部创建了一个新的 XMLHttpRequest 对象，设置了请求方法、URL、请求状态变化的监听器，并发送请求。如果是POST请求，还需要设置请求头并发送数据。