На практических примерах показано, как добавлять Ajax-эффекты в уже существующие веб-приложения и делать сайты более интерактивными, не переделывая их целиком. Кратко даны основы технологий Ajax, принципы работы с объектами XMLHttpRequest и создания запросов к веб-серверу. Описаны основные библиотеки Ajax, включая Prototype, script.aculo.us, Rico и MochiKit. Рассмотрены интерактивные эффекты Ajax: использование событий и обработчиков событий. Описаны элементы типа accordion, страницы с вкладками, всплывающие окна и др. Приведены способы обновления данных, включая добавление новых данных, удаление и обновление, и все это в рамках одной страницы. Объяснены причины возникновения эффектов типа \"поломки\" кнопки возврата или потери истории посещений и способы устранения большинства подобных неполадок. Раскрыты некоторые сложные эффекты CSS, в том числе использование объектов SVG и Canvas. Даны приемы написания mashup-приложений, затронуты вопросы масштабирования, распределения ресурсов и безопасности веб-приложений.

Предисловие
Аудитория
Краткое содержание книги
Условные обозначения
Права на использование кода
Обратная связь
Safari® Enabled
Благодарности
Глава 1. Подготовка к добавлению Ajax
Технологии, составляющие Ajax
Естественное движение вперед
Технологии: обзор книги
С чистого листа
Валидаторы XHTML- и HTML-кода
Валидаторы CSS-кода
Проверка доступности
Преобразование таблиц в формат CSS
Продолжаем преобразования - элемент за
элементом
Индивидуальные особенности браузеров
Управляем страницей и добавляем Ajax
Устанавливаем контроль
Понимание нужд клиентов
Узнайте своих пользователей
Политика открытых дверей
План
Разработка структуры сайта
Познакомьтесь со своим читателем
Безопасность и надежность
Сильная и слабая связь
Постепенное улучшение или полная
реконструкция?
Глава 2. Кусочки Ajax
Веб-приложение
Структура объекта XMLHttpRequest
Подготовка объекта к использованию
Подготовка и отправка запроса
GET, POST и REST
Параметры
Отправка запроса
Обработка Ajax-ответа
Простой и быстрый ответ: HTML-фрагмент и
innerHTML
Работа с более традиционным XML
Упрощение обработки с помощью JSON
(X)HTML-фрагмент
Конечные точки, песочница JavaScript и виджеты
Конечные точки JSON и создание динамического
сценария
Динамические сценарии с XML
Меры безопасности
Первый взгляд на производительность
Последнее слово о синхронном и асинхронном
Глава 3. Терминология и инструменты Ajax
Prototype
Свойство prototype языка JavaScript
Ассоциативные массивы и риск Prototype
Внешние библиотеки: риск и преимущества
script.aculo.us
Эффекты script.aculo.us
Rico
Оперативная прокрутка Ajax
Виджеты Rico
Песочница JavaScript и прокси
Dojo
Цепочка обработчиков событий
Декларативный HTML
Как с помощью JavaScript обойти нестандартные
атрибуты
Другие библиотеки
jQuery
MochiKit
Пользовательский интерфейс Yahoo! UI
mooTools и moo.fx
Библиотека Sarissa
WZ_jsGraphics и qForms
И так далее
Глава 4. Интерактивные эффекты
Обработка событий в Ajax
Сопровождаемый обработчик событий
Смешанный обработчик событий
Система обработки событий Dojo Event System и
целевой объект
Оперативная (JIT) информация
Форма для справки
Всплывающая подсказка
Предварительный просмотр
Оперативный просмотр
Ajax-просмотр
Выделение цветом выполненных и невыполненных
операций
Таймеры и анимация
Ajax-таймеры
Подсветка
Глава 5. Пространство. Последняя граница
Горизонтальный интервал. Accordion
Создание эффекта
Переходный accordion
Определение ширины и высоты элемента
Окончательная отделка перехода
Использование готового эффекта accordion
Упаковка кода эффекта
Смешивание эффекта accordion и Ajax-запросов
Страницы с вкладками
Взгляд на содержимое, разбитое на вкладки
Возвращаясь к упаковке: создание универсальных
вкладок
Использование YUI TabView
Вкладки и доступность
Слои
Глава 6. Динамические данные
Редактирование по месту
Добавление изменяемого поля
Сторона клиента
Сторона сервера
Редактирование по месту: производительность,
безопасность и доступность
Предотвращение SQL-инъекций
Производительность и доступность
Улучшения
Подсвечивание изменений
Сигнализация удаления
Запрос и подсвечивание обновлений
Повторный взгляд на доступность
внутристраничных обновлений
Повторный взгляд на внутристраничное удаление
Повторный взгляд на внутристраничные
добавления
Оперативная проверка достоверности
Производительность и двухфазное подтверждение
Ajax, который ни с кем не конфликтует
Ajax, кэширование, транзакции базы данных
Эффекты для данных внешних библиотек
Разработка и обслуживание форм
Сортировка drag-and-drop библиотеки
script.aculo.us
Проверка достоверности Adobe Spry
Другие библиотеки, обрабатывающие данные
Глава 7. История, навигация, место и
одностраничные приложения
Многостраничный контент бросает вызов
Создание каркаса слайд-шоу
Создание слайд-шоу фотографий
Разбивка текста
Пролистывание данных
Запомним место
Запоминание места и фрагменты страницы
Запоминание места своевременно
Разница между умным и сообразительным
Старое и новое, плечом к плечу
Новый взгляд на страницу
Post-Mortem
Глава 8. Добавление сложных визуальных
эффектов
Сложные трюки CSS
Закругленные углы
Слайдеры и полосы прокрутки
Веб-меню
Перемещаемый контейнер
Масштабируемая векторная графика SVG
Включение SVG
Добавляем script
Встроенные SVG-элементы
Быстрый взгляд на SVG
Основные фигуры и атрибуты
Градиенты, фильтры, эффекты и defs
Смешиваем SVG и Ajax
HTML5 Canvas
Будущее графики
Глава 9. Сайт-мэшап
Карты Google
Карты Google: быстро и просто
Из пункта А в пункт Б
Второй сервис - Flickr
Создаем мэшап
Создание объектов фотографий и повторное
сравнение локальных функций с Prototype
Переделываем Flickr/Google в страницу с вкладками
Добавляем Technorati к нашему мэшапу
Реконструирование мэшапа
Доступные вкладки
Карты Google и IE, или Я отпускаю тебя
Абстрагирование веб-сервиса
Реконструированные клиенты
Приложение без сценариев
Новый Ajax-клиент
Подытоживая мэшап
Глава 10. Масштабирование, инфраструктура и
основы основ
Каркасы: сильная связь vs слабая связь
Веб-сервис: ресурсы и безопасность
Ajax-библиотеки: свои или чужие
Основы Ajax-проектирования
Упаковка функциональности в модули
Сопровождение и тестирование
Утечка памяти, локальное хранение и надежность
Приведение каждого эффекта к простейшему виду
Важные области сайта
Не переборщите с мэшапами
Множество устройств
Поменьше "крутых" эффектов
"Круто" не всегда плохо
Каркасы дня
ASP.NET и AJAX
Java и GWT
PHP-каркасы
Python, GWT и Django
Эй! Это ж Perl!
Ruby on Rails, Ajax и сильная связь
Идите и добавляйте Ajax
Предметный указатель