| |||||||||||||||||||||||||||||||
| |||||||||||||||||||||||||||||||
| |||||||||||||||||||||||||||||||
В покере есть такая начальная комбинация карт - туз и валет. Ее называют «AJAX». Если она выпадает при раздаче, то шансы на выигрыш очень велики. Существует одноименная компьютерная технология, которая обещает стать козырной картой в колоде любого сайта. ТеорияВначале - пара слов про технологии, которые мы будем использовать в статье. Чтобы писать полноценные веб-приложения на Аяксе, надо на приличном уровне знать и уметь применять:
Если в вышеперечисленном списке встретились незнакомые слова, то не стоит отчаиваться - я поясню их, когда это понадобится. Общая схема работыПользователь заходит на страничку, сделанную при помощи Аякса, и производит некое действие, например, кликает мышкой по ссылке. Обработчик этого события посылает запрос на сервер. Он получает информацию и посылает ответ, который обрабатывает соответствующая функция на стороне клиента. Эта функция формирует готовый HTML и показывает его пользователю. Чтобы представить этот процесс, можно взглянуть на схему.
XMLHttpRequestДля того чтобы написать наше первое приложение – интерактивную страничку на AJAX, нам надо научиться пользоваться объектом XMLHttpRequest. Что может быть проще, чем создать объект нужного класса? Но вспомним главную беду веб-программистов: у всех пользователей разные браузеры. Microsoft Internet Explorer поддерживает XMLHttpRequest в виде ActiveX-объекта Microsoft.XMLHTTP, остальные же браузеры считают его нативным, и проблем возникнуть не должно. Теперь алгоритм создания объекта XMLHttpRequest прояснен. Сначала определяем браузер, потом создаем объект нужным нам образом:
Что умеет делать этот объект? Самой главной функциональностью для нас будет возможность отправлять запросы на сервер и обрабатывать ответы в асинхронном режиме. Нам придется использовать метод установки параметров соединения open и метод отправки запроса send. Также мы задействуем свойство onreadystatechange для установки обработчика получения ответа на запрос. Полный список свойств и методов XMLHttpRequest можно посмотреть в таблицах «Методы класса XMLHttpRequest» и «Свойства класса XMLHttpRequest». Методы класса XMLHttpRequest
Свойства класса XMLHttpRequest
Теперь, я думаю, ты достаточно осведомлен и готов писать метод отправки запроса. В качестве параметров мы будем передавать ему адрес, на который идет запрос (я назвал этот параметр «file», так как использовал относительные адреса), идентификатор HTML-элемента - _resultId, в котором будем отображать результат, и обработчик ответа на данный запрос - getRequestProc. Реализация проста, как арбуз: определяем параметры соединения, устанавливаем обработчик и посылаем запрос с пустым телом на сервер.
Осталось написать обработчик ответа, и наш мини-Аякс-движок готов. Здесь тоже все просто. Проверяем, полностью ли передан ответ на запрос, и выводим полученный ответ в элемент с идентификатором _resultId, который мы так предусмотрительно сохранили:
Теперь добавим переменных и упакуем все в один файл ajax.js:
| |||||||||||||||||||||||||||||||
Теги: Web 2.0 , программирование | |||||||||||||||||||||||||||||||
|
четверг, 21 июля 2011 г.
Технология AJAX для создания современных веб-сайтов
Подписаться на:
Комментарии к сообщению (Atom)
Комментариев нет:
Отправить комментарий