ajax构造get、post、put请求

在JavaScript中，可以使用原生的XMLHttpRequest对象或者现代的fetch API来构造AJAX请求。以下是使用这两种方法构造GET、POST、PUT请求的示例代码。

使用XMLHttpRequest构造GET、POST、PUT请求：

// GET请求
function getRequest(url) {
    var xhr = new XMLHttpRequest();
    xhr.open("GET", url, true);
    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 && xhr.status == 200) {
            console.log(xhr.responseText);
        }
    };
    xhr.send();
}
 
// POST请求
function postRequest(url, data) {
    var xhr = new XMLHttpRequest();
    xhr.open("POST", url, true);
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 && xhr.status == 200) {
            console.log(xhr.responseText);
        }
    };
    xhr.send(data);
}
 
// PUT请求
function putRequest(url, data) {
    var xhr = new XMLHttpRequest();
    xhr.open("PUT", url, true);
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 && xhr.status == 200) {
            console.log(xhr.responseText);
        }
    };
    xhr.send(data);
}

使用fetch API构造GET、POST、PUT请求：

// GET请求
fetch(url)
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));
 
// POST请求
fetch(url, {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(data)
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));
 
// PUT请求
fetch(url, {
  method: 'PUT',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(data)
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));

在这两种方法中，fetch API 是现代的推荐方式，因为它提供了更好的异步处理和更简洁的语法。而XMLHttpRequest是较旧的方法，但在所有现代浏览器中仍然得到支持。选择哪种方法取决于你的具体需求和对浏览器兼容性的要求。