Ajax学习 基础概念 发送请求 常见方法

Ajax（Asynchronous JavaScript and XML）是一种创建交互式网页的技术，可以在不重新加载整个网页的情况下更新数据。以下是使用JavaScript创建Ajax请求的常见方法：

1. 原生JavaScript的XMLHttpRequest对象：

var xhr = new XMLHttpRequest();
xhr.open("GET", "your-api-endpoint", true);
xhr.onreadystatechange = function () {
  if (xhr.readyState == 4 && xhr.status == 200) {
    console.log(xhr.responseText);
  }
};
xhr.send();

2. 使用jQuery的$.ajax方法：

$.ajax({
  url: "your-api-endpoint",
  type: "GET",
  success: function (response) {
    console.log(response);
  },
  error: function (xhr, status, error) {
    console.error("An error occurred: " + status + "\nError: " + error);
  }
});

3. 使用jQuery的$.get或$.post方法（分别对应GET和POST请求）：

// GET请求
$.get("your-api-endpoint", function (data) {
  console.log(data);
});
 
// POST请求
$.post("your-api-endpoint", { key1: "value1", key2: "value2" }, function (data) {
  console.log(data);
});

4. 使用现代JavaScript的fetchAPI：

fetch("your-api-endpoint")
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));

以上代码展示了如何使用不同的方法发送Ajax请求。原生的XMLHttpRequest适用于所有现代浏览器，而fetch是一个更现代、更简洁的API。jQuery的$.ajax和特定类型的$.get/$.post方法提供了更简洁的语法，尤其是对于简单的GET或POST请求。