Автор оригинала: FreeCodeCamp Community Member.
Что такое ajax?
Ajax обозначает Asynchronous JavaScript и XML Отказ Это не язык программирования. Это технология для разработки лучшего, быстрой и интерактивной веб-приложений с использованием HTML, CSS, JavaScript и XML.
- HTML: Гипертекстовый язык разметки (HTML) используется для определения структуры веб-приложения.
- CSS: каскадные стиль листа (CSS) используется для обеспечения внешнего вида и стиля в веб-приложении.
- JavaScript: JavaScript используется для создания веб-приложения Interactive, интересных и удобных для пользователя.
- XML: Расширяющийся язык разметки (XML) – это формат для хранения и транспортировки данных с веб-сервера.
Что означает асинхронный в Аякс?
Asynchronous означает, что веб-приложение может отправлять и получать данные с веб-сервера без обновления страницы. Этот фоновый процесс отправки и получения данных с сервера вместе с обновлением разных разделов веб-страницы определяет асинхронное свойство/особенность AJAX.
Как работает ajax
Ajax использует встроенный браузер XMLHTTPREQUEST объект Чтобы запросить данные с веб-сервера и HTML DOM отображать или использовать данные.
XMLHTTPREQUEST объект : Это API в форме объект, методы которого помогают при передаче данных между веб-браузером и веб-сервером.
HTML DOM : Когда веб-страница загружается, браузер создает модель объекта документа страницы.
Создайте объект XMLHTTPREQUEST:
var xhttp = new XMLHttpRequest();
Свойства объекта XMLHTTPREQUEST:
ReadyState
является свойством объекта XMLHTTPREQUEST, который содержит состояние XMLHTTPREQUEST.
- 0: запрос не инициализирован
- 1: Соединение сервера установлено
- 2: запрос получен
- 3: Запрос обработки
- 4: Запрос закончен и ответ готов
“ `onreadystateChange““ – это свойство объекта XMLHTTRECEST, который определяет функцию, которая будет называться, когда свойство HeadyState изменяется. “ “ Статус“` является свойством объекта XMLHTTPREQUEST, который возвращает номер статуса запроса
- 200: «ОК»
- 403: «Запрещено»
- 404 Не Найдено”
XMLHTTPREQUEST Способы объекта: Чтобы отправить запрос на веб-сервер, мы используем методы Open () и отправки () объекта XMLHTTPREQUEST.
xhttp.open("GET", "content.txt", true); xhttp.send();
Создайте функцию ChangeContent () с помощью JavaScript:
function changeContent() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("foo").innerHTML = this.responseText; } }; xhttp.open("GET", "content.txt", true); xhttp.send(); }
Пример Ajax для изменения содержимого веб-страницы:
The XMLHttpRequest Object
Файл Content.txt
следует присутствовать в корневом каталоге веб-приложения.