.ajax()

Пример 1: Отправка GET-запроса

$.ajax({
  url: "example.php", // URL-адрес сервера
  method: "GET", // Метод запроса
  dataType: "html", // Тип данных, которые ожидаются от сервера
  success: function(response) {
    // Функция, которая вызывается при успешном выполнении запроса
    $("#result").html(response);
  },
  error: function(jqXHR, textStatus, errorThrown) {
    // Функция, которая вызывается при ошибке выполнения запроса
    console.log(textStatus, errorThrown);
  }
});

Этот пример демонстрирует, как отправить GET-запрос на сервер и получить HTML-код в ответ.

Пример 2: Отправка POST-запроса

$.ajax({
  url: "example.php", // URL-адрес сервера
  method: "POST", // Метод запроса
  data: { // Данные, которые будут отправлены на сервер
    name: "John",
    age: 30
  },
  dataType: "html", // Тип данных, которые ожидаются от сервера
  success: function(response) {
    // Функция, которая вызывается при успешном выполнении запроса
    $("#result").html(response);
  },
  error: function(jqXHR, textStatus, errorThrown) {
    // Функция, которая вызывается при ошибке выполнения запроса
    console.log(textStatus, errorThrown);
  }
});

Этот пример демонстрирует, как отправить POST-запрос на сервер с данными в теле запроса и получить HTML-код в ответ.

Пример 3: Отправка запроса с заголовком

$.ajax({
  url: "example.php", // URL-адрес сервера
  method: "GET", // Метод запроса
  headers: { // Заголовки, которые будут отправлены на сервер
    "Authorization": "Bearer xxxxxxxx",
    "X-Api-Version": "1.0"
  },
  dataType: "html", // Тип данных, которые ожидаются от сервера
  success: function(response) {
    // Функция, которая вызывается при успешном выполнении запроса
    $("#result").html(response);
  },
  error: function(jqXHR, textStatus, errorThrown) {
    // Функция, которая вызывается при ошибке выполнения запроса
    console.log(textStatus, errorThrown);
  }
});

Этот пример демонстрирует, как отправить запрос на сервер с заголовками и получить HTML-код в ответ.

Пример 4: Использование Promise

$.ajax({
  url: "example.php", // URL-адрес сервера
  method: "GET", // Метод запроса
  dataType: "html" // Тип данных, которые ожидаются от сервера
}).done(function(response) {
  // Функция, которая вызывается при успешном выполнении запроса
  $("#result").html(response);
}).fail(function(jqXHR, textStatus, errorThrown) {
  // Функция, которая вызывается при ошибке выполнения запроса
  console.log(textStatus, errorThrown);
});

Этот пример демонстрирует, как использовать Promise для выполнения запроса и получения ответа.

Пример 5: Отправка запроса с параметрами

$.ajax({
  url: "example.php", // URL-адрес сервера
  method: "GET", // Метод запроса
  data: { // Параметры, которые будут отправлены на сервер
    name: "John",
    age: 30
  },
  dataType: "html", // Тип данных, которые ожидаются от сервера
  success: function(response) {
    // Функция, которая вызывается при успешном выполнении запроса
    $("#result").html(response);
  },
  error: function(jqXHR, textStatus, errorThrown) {
    // Функция, которая вызывается при ошибке выполнения запроса
    console.log(textStatus, errorThrown);
  }
});

Этот пример демонстрирует, как отправить запрос на сервер с параметрами и получить HTML-код в ответ.

Пример 6: Использование настроек по умолчанию

$.ajaxSetup({
  url: "example.php", // URL-адрес сервера
  method: "GET", // Метод запроса
  dataType: "html" // Тип данных, которые ожидаются от сервера
});

$.ajax({
  data: { // Параметры, которые будут отправлены на сервер
    name: "John",
    age: 30
  },
  success: function(response) {
    // Функция, которая вызывается при успешном выполнении запроса
    $("#result").html(response);
  },
  error: function(jqXHR, textStatus, errorThrown) {
    // Функция, которая вызывается при ошибке выполнения запроса
    console.log(textStatus, errorThrown);
  }
});Этот пример демонстрирует, как использовать настройки по умолчанию для выполнения запроса.

Пример 7: Использование метода .load()

$("#result").load("example.php");

Этот пример демонстрирует, как использовать метод .load() для загрузки HTML-кода с сервера и вставки его в элемент страницы.

Пример 8: Использование метода .get()

$.get("example.php", function(response) {
  // Функция, которая вызывается при успешном выполнении запроса
  $("#result").html(response);
});

Этот пример демонстрирует, как использовать метод .get() для отправки GET-запроса на сервер и получения HTML-кода в ответ.

Пример 9: Использование метода .post()

$.post("example.php", { name: "John", age: 30 }, function(response) {
  // Функция, которая вызывается при успешном выполнении запроса
  $("#result").html(response);
});

Этот пример демонстрирует, как использовать метод .post() для отправки POST-запроса на сервер с данными в теле запроса и получения HTML-кода в ответ.

Пример 10: Использование метода .getJSON()

$.getJSON("example.php", function(response) {
  // Функция, которая вызывается при успешном выполнении запроса
  $("#result").html(JSON.stringify(response));
});

Этот пример демонстрирует, как использовать метод .getJSON() для отправки GET-запроса на сервер и получения JSON-данных в ответ.

Заключение

Метод .ajax() в jQuery предоставляет широкие возможности для выполнения асинхронных запросов к серверу. Он позволяет отправлять GET- и POST-запросы, работать с различными форматами данных и использовать настройки по умолчанию для упрощения кода. Кроме того, в jQuery есть другие методы, такие как .load(), .get(), .post() и .getJSON(), которые позволяют выполнять запросы к серверу еще более просто и удобно.