Что такое АЯКС?
AJAX — мечта разработчика, потому что вы можете:
- Чтение данных с веб-сервера — после загрузки веб-страницы
- Обновите веб-страницу без перезагрузки страницы
- Отправка данных на веб-сервер — в фоновом режиме
Пример AJAX
Let AJAX change this text
Объяснение примера AJAX
HTML-страница
<!DOCTYPE html>
<html>
<body>
<div id="demo">
<h2>Let AJAX change this text</h2>
<button type="button" onclick="loadDoc()">Change Content</button>
</div>
</body>
</html>
HTML-страница содержит раздел <div> и <button>.
Раздел <div> используется для отображения информации с сервера.
<кнопка> вызывает функцию (если она нажата).
Функция запрашивает данные с веб-сервера и отображает их:
Функция loadDoc()
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("demo").innerHTML = this.responseText;
}
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();
}
Что такое АЯКС?
AJAX = синхронный J avaScript и X ML .
AJAX — это не язык программирования.
AJAX просто использует комбинацию:
- Встроенный в браузер объект XMLHttpRequest (для запроса данных с веб-сервера).
- JavaScript и HTML DOM (для отображения или использования данных)
AJAX — вводящее в заблуждение название. Приложения AJAX могут использовать XML для передачи данных, но в равной степени распространена передача данных в виде обычного текста или текста JSON.
AJAX позволяет обновлять веб-страницы асинхронно, обмениваясь данными с веб-сервером за кулисами. Это означает, что можно обновлять части веб-страницы без перезагрузки всей страницы.
Как работает АЯКС
- 1. На веб-странице происходит событие (страница загружается, нажимается кнопка)
- 2. Объект XMLHttpRequest создается с помощью JavaScript.
- 3. Объект XMLHttpRequest отправляет запрос на веб-сервер.
- 4. Сервер обрабатывает запрос
- 5. Сервер отправляет ответ обратно на веб-страницу.
- 6. Ответ читается JavaScript
- 7. Правильное действие (например, обновление страницы) выполняется с помощью JavaScript.
Полное руководство по AJAX
Это было краткое описание AJAX.
Полное руководство по AJAX можно найти в W3Schools AJAX Tutorial .
Дополнительные примеры AJAX см. в разделе Примеры AJAX W3Schools .