Аякс
Самая веская причина использовать среду JavaScript — стандартизировать запросы Ajax в браузерах. Запрос Ajax — это асинхронный HTTP-запрос, который отправляет запрос серверному сценарию, а затем получает результат ответа, например данные в формате XML, JSON, HTML или простом текстовом формате. Большинство фреймворков JavaScript имеют некоторую форму объекта запроса Ajax, который принимает ряд параметров в качестве параметров. К этим параметрам относятся функции обратного вызова, которые вызываются при получении ответа от веб-сервера на запросы Ajax для ExtJS, MooTools и Prototype, которые выглядят следующим образом:
Листинг 11: Ajax-запрос в библиотеке ExtJS
Ext.Ajax.request({
URL: 'server_script.php',
параметры: {
имя1: 'значение1',
имя2: 'значение2'
},
метод: 'POST',
успех: функция (транспорт) {
оповещение(transport.responseText);
}
});
ExtJS принимает параметр, включая такие поля, как URL-адрес, параметры, метод и функция обработки успеха. Поле URL-адреса содержит адрес серверного сценария, который вызывается запросами Ajax. Сам Params представляет собой объект, состоящий из пар ключ/значение, которые затем передаются на сервер. Поле метода имеет два необязательных значения: GET или POST, а по умолчанию используется метод post. Последнее поле — это успех, которое вызывается после того, как сервер получает успешный ответ. В этом примере предполагается, что сервер возвращает простой текст, и этот текст предоставляется пользователю через метод alert().
Далее давайте подробнее рассмотрим Ajax-запросы в MooTools.
Листинг 12: Ajax-запрос в MooTools
новый запрос({
URL: 'server-script.php',
данные: {
имя1: 'значение1',
имя2: 'значение2'
},
метод: «пост»,
onComplete: функция (ответ) {
предупреждение (ответ);
}
}).отправлять();
Как видите, MooTools очень похож на ExtJS. Вы заметите, что переменные передаются через поле данных, а поля метода должны быть написаны строчными буквами. Кроме того, в отличие от функции обработчика успеха, MooTools использует функцию onComplete. Наконец, в отличие от ExtJS, MooTools фактически отправляет запрос с помощью функции Request send().
Наконец, давайте посмотрим на очевидные различия между Prototype.
Листинг 13. Ajax-запрос в Prototype
новый Ajax.Request('server-script.php', {
параметры: {
имя1: 'значение1',
имя2: 'значение2'
},
метод: «пост»,
onSuccess: функция (транспорт) {
оповещение(transport.responseText);
}
});
Видите ли, Prototype работает точно так же, но с небольшими синтаксическими различиями. Начнем с того, что прототип объекта Request принимает два параметра для передачи конструктору. Первый параметр — это URL-адрес для отправки запроса, как вы видели в двух предыдущих примерах, а второй параметр — это объект, содержащий параметры для каждого запроса Ajax. Разумеется, URL-адрес передается как отдельный параметр и его нет в списке опций. Кроме того, стоит отметить, что в отличие от MooTools конструктор объекта Prototype отправляет запрос неявно, поэтому нет необходимости вызывать какой-либо метод для запуска HTTP-запроса.
Большинство фреймворков JavaScript поддерживают Ajax, помимо того, что я здесь упомянул. Некоторые заметные улучшения включают автоматическое обновление элементов при получении ответа без необходимости использования каких-либо специальных функций onSuccess. Некоторые библиотеки имеют встроенную функцию автозаполнения, как вы видите в поисковой системе Google, которая выдает вам некоторые предложения по запросам по мере ввода.
В следующих главах вы узнаете об улучшениях пользовательского опыта (UE), которые платформы JavaScript приносят веб-разработчикам.
Адрес перепечатки: http://www.denisdeng.com/?p=729 .
Исходный адрес: http://www.ibm.com/developerworks/web/library/wa-jsframeworks/index.html.