AJAX - объект XMLHttpRequest
Краеугольным камнем AJAX является объект XMLHttpRequest.
Объект XMLHttpRequest
Все современные браузеры поддерживают объект XMLHttpRequest.
Объект XMLHttpRequest может использоваться для обмена данными с веб-сервером за кулисами. Это означает, что можно обновить части веб-страницы без перезагрузки всей страницы.
Создание объекта XMLHttpRequest
Все современные браузеры (Chrome, Firefox, IE7 +, EDGE, Safari, Opera) имеют встроенный объект XMLHttpRequest.
Синтаксис для создания объекта XMLHttpRequest:
variable = new XMLHttpRequest();
Пример
var xhttp = new XMLHttpRequest();
Доступ через домены
По соображениям безопасности современные обозреватели не разрешают доступ через домены.
Это означает, что веб-страница и XML-файл, который он пытается загрузить, должны располагаться на одном сервере.
Примеры на html5css.dev все открытые XML-файлы, расположенные в домене html5css.dev.
Если вы хотите использовать приведенный выше пример на одной из ваших собственных веб-страниц, загружаемые XML-файлы должны располагаться на собственном сервере.
Старые браузеры (IE5 и IE6)
В старых версиях Internet Explorer (5/6) вместо объекта XMLHttpRequest используется объект ActiveX:
variable = new ActiveXObject("Microsoft.XMLHTTP");
Чтобы обработать IE5 и IE6, проверьте, поддерживает ли обозреватель объект XMLHttpRequest, или создайте объект ActiveX:
Пример
if (window.XMLHttpRequest) {
// code for modern browsers
xmlhttp = new XMLHttpRequest();
}
else {
// code for old IE browsers
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
Методы объекта XMLHttpRequest
| Метод | Описание |
|---|---|
| new XMLHttpRequest() | Создает новый объект XMLHttpRequest |
| abort() | Отмена текущего запроса |
| getAllResponseHeaders() | Возвращает сведения о заголовке |
| getResponseHeader() | Возвращает сведения о конкретном заголовке |
| open(method, url, async, user, psw) | Задает запрос метод: тип запроса GET или POST URL-адрес: расположение файла Async: true (асинхронный) или false (синхронный) пользователь: необязательное имя пользователя PSW: необязательный пароль |
| send() | Отправляет запрос на сервер Используется для запросов GET |
| send(string) | Отправляет запрос на сервер. Используется для запросов POST |
| setRequestHeader() | Добавление пары "метка/значение" в заголовок для отправки |
XMLHttpRequest Свойства объекта
| Свойство | Описание |
|---|---|
| onreadystatechange | Определяет функцию, вызываемую при изменении свойства readyState |
| readyState | Содержит статус XMLHttpRequest. 0: запрос не инициализирован 1: установленное соединение сервера 2: запрос получен 3: обработка запроса 4: запрос готов и ответ готов |
| responseText | Возвращает данные ответа в виде строки |
| responseXML | Возвращает данные ответа в виде XML-данных |
| status | Возвращает статус-номер запроса 200: "OK" 403: "запрещено" 404: "не найдено" Для полного списка перейдите к ссылке http-сообщения |
| statusText | Возвращает текст состояния (например, "OK" или "не найден") |
