AJAX-常用请求方法和数据提交

在AJAX中，常用的请求方法包括GET和POST。GET用于从服务器获取数据，而POST通常用于将数据发送到服务器以处理。

以下是使用原生JavaScript的AJAX GET和POST请求的示例代码：

// AJAX GET请求
var xhr = new XMLHttpRequest();
xhr.open("GET", "https://api.example.com/data", true);
xhr.onreadystatechange = function () {
  if (xhr.readyState == 4 && xhr.status == 200) {
    // 请求成功
    var response = JSON.parse(xhr.responseText);
    console.log(response);
  }
};
xhr.send();
 
// AJAX POST请求
var xhr = new XMLHttpRequest();
xhr.open("POST", "https://api.example.com/submit", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function () {
  if (xhr.readyState == 4 && xhr.status == 200) {
    // 请求成功
    var response = JSON.parse(xhr.responseText);
    console.log(response);
  }
};
var data = new FormData(document.querySelector("form")); // 假设有一个form元素
xhr.send(data);

在实际应用中，你可能会使用更现代的方法，比如fetch API，它提供了更简洁的语法。以下是使用fetch API的GET和POST请求示例：

// Fetch GET请求
fetch("https://api.example.com/data")
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));
 
// Fetch POST请求
fetch("https://api.example.com/submit", {
  method: 'POST',
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded'
  },
  body: new URLSearchParams(data) // 假设data是一个包含表单数据的对象
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));

在这些示例中，我们展示了如何发送AJAX请求以及如何处理响应。注意，在实际应用中，你可能需要处理更多的错误情况，并考虑跨域请求、请求超时等问题。