jQuery. Подробное руководство по продвинутому javascript

614 Pages·2011·21.26 MB·Russian

by  Бер Бибо

Принципы, паттерны и методики
БЕР БИБО
гибкой разработки на языке C# ИЕГУДА КАЦ ивздтоарноиее
Роберт С. Мартин Цель данной книги – собрать воедино все методики гибкой
разработки и пока зать их работоспособность. Основанная на jQuery
занимается разработкой ПО с 1970
П
богатом опыте известного специ али ста, Роберта Мартина, книга
года, а с 1990 года оказывает кон-
р
охватывает как теорию, так и все аспекты практического при-
сультационные услуги по всему ми - и
ру. Он основатель и президент компа- менения гибкой разработки. гн
нии Object Mentor, Inc. – коллектива В книге представлены следующие вопросы: иц
би
опытных консультантов, обучающих • Принципы гибкой разработки, в том числе четырнадцать прин- кп
клиентов работе на языках C++ ципов экстремального программирования оы
ип рJоaеvaк,т оибръоевкатнниою-о, рпиаетнттеиррноавма,н нUоMмLу, • Питоенряатциияй о иб ъвеыдпиунсекноивя, разбиения и скорости, планирование й р, п
аа
гибким методикам и экстремальному • Разработка через тестирование, проектирование, начиная зт
т
программиро ванию. с тестов, и приемочное тестирование ре
ар
• Рефакторинг с применением автономного тестирования б
н
Мика Мартин • Парное программирование оы Подробное руководство
т
сотрудник компании Object Mentor, • Гибкое проектирование и «ароматы» дизайна к и по продвинутому JavaScript
и
разработчик, консультант и настав- • Пять видов UML-диаграмм и способы их эффективного ис- м
ник по различным предметам – от пользования нае
объектно-ориентированных прин- • Объектно-ориентированный подход и паттерны, применяемые т
яо
ципов и паттернов до практического к проектированию пакетов зд
применения методики гибкой раз- • Как все это сочетается в реальном проекте ыи
кк
работки ПО. Мика является одним
Взяв какую-либо реальную задачу, авторы показывают, какие еи
из создателей и ведущим разработ- ошибки и ложные ходы можно допустить в ходе ее решения и как
чиком проекта FitNesse с открытым применение правильных методик позволяет добиться успеха. C
исходным кодом. Он автор многих
Книга в равной мере подойдет и тем, кто еще только собирается
статей, регулярно выступает на кон-
практиковать гибкую разработку, и тем, кто желает усовершенство- #
ференциях.
вать уже имеющиеся навыки. Издание содержит много примеров
исходного кода, которые можно скачать с сайта авторов.
Êàòåãîðèÿ: ïðîãðàммèðîâàíèå Спрашивайте Мартин Фаулер Мартин Фаулер
наши книги: Рефакторинг. UML. Основы,
Óðîâåíü ïîäãîòîâêè ÷èòàòåëåé: сðåäíèé
Улучшение 3-е издание МР
существующего . М. С
.
кода А М
РА
Т
ИР
Т
НИ
Н
,
ISBN 978-5-93286-197-4
www.symbol.ru
Издательство «Символ-Плюс»
[phone], [phone] 9 785932 861974
По договору между издательством «Символ-Плюс» и Интернет-мага-
зином «Books.Ru – Книги России» единственный легальный способ
получения данного файла с книгой ISBN 978-5-93286-201-8, назва ние
«jQuery. Подробное руководство по продвинутому JavaScript, 2-е из-
дание». Идеальная фотография со вспышкой» – покупка в Интернет-
магазине «Books.Ru – Книги России». Если Вы получили данный
файл каким-либо другим образом, Вы нарушили междуна родное за-
конодательство и законодательство Российской Федерации об охране
авторского права. Вам необходимо удалить данный файл, атакже со-
общить издательству «Символ-Плюс» ([email protected]), где именно
Вы получили данный файл.
jQuery
in Action
Second edition

Bear Bibeault, Yehuda Katz
jQuery
Подробное руководство
по продвинутому JavaScript
Второе издание

Бер Бибо, Иегуда Кац
Санкт-Петербург – Москва
2011
Серия «High tech»
Бер Бибо, Иегуда Кац
jQuery. Подробное руководство
по продвинутому JavaScript, 2-е издание
Перевод А. Киселева
Главный редактор А. Галунов
Зав. редакцией Н. Макарова
Выпускающий редактор П. Щеголев
Редактор Ю. Бочина
Корректор С. Минин
Верстка К. Чубаров
Бер Бибо, Иегуда Кац
jQuery. Подробное руководство по продвинутому JavaScript, 2-е издание. –
Пер. с англ. – СПб.: Символ-Плюс, 2011. – 624 с., ил.
ISBN 978-5-93286-201-8
Издание представляет собой введение и справочное руководство по jQuery –
мощной платформе для разработки веб-приложений. Подробно описывается,
как выполнять обход документов HTML, обрабатывать события, добавлять под-
держку технологии Ajax в свои веб-страницы, воспроизводить анимацию и ви-
зуальные эффекты. Уникальные «лабораторные страницы» помогут за крепить
изучение каждой новой концепции на практических примерах. Рас смотрены
вопросы взаимодействия jQuery с другими инструментами и плат формами
и методы создания модулей расширения для этой библиотеки.
Книга предназначена для разработчиков, знакомых с языком JavaScript и тех-
нологией Ajax и стремящихся создавать краткий и понятный программный
код. Уникальная способность jQuery составлять «цепочки» из методов позво-
ляет выполнять несколько последовательных операций над элементами стра-
ницы, в результате чего код сокращается втрое.
Второе издание подверглось обширной переделке, чтобы продемонстрировать
новые возможности версии jQuery 1.4: новые нестандартные события, простран-
ства имен событий, функции и эффекты и другие полезные методы и функции.
Кроме того, в книге появилась совершенно новая часть, полностью посвящен-
ная библиотеке jQuery UI, которая охватывает обширнейшие изменения, вне-
сенные в jQuery UI с момента прошлой публикации.
ISBN 978-5-93286-201-8
ISBN 978-1-935182-32-0 (англ)
© Издательство Символ-Плюс, 2011
Authorized translation of the English edition © 2010 Manning Publications Co. This
trans lation is publ ished and sold by permission of Manning Publications Co., the owner
of all rights to publish and sell the same.
Все права на данное издание защищены Законодательством РФ, включая право на полное или час-
тичное воспроизведение в любой форме. Все товарные знаки или зарегистрированные товарные зна-
ки, упоминаемые в настоящем издании, являются собственностью соответствующих фирм.
Издательство «Символ-Плюс». 199034, Санкт-Петербург, 16 линия, 7,
тел. [phone], www.symbol.ru. Лицензия ЛП N 000054 от 25.12.98.
Подписано в печать 28.02.2011. Формат 70×100 1/16. Печать офсетная.
Объем 39 печ. л. Тираж 1200 экз. Заказ №
Отпечатано с готовых диапозитивов в ГУП «Типография «Наука»
199034, Санкт-Петербург, 9 линия, 12.
Оглавление
Отзывы на первое издание ......................................................13
Предисловие ...........................................................................15
Введение ко второму изданию ................................................17
Введение к первому изданию ..................................................19
Благодарности ........................................................................22
Об этой книге ..........................................................................25
Об авторах ..............................................................................31
Часть I. Ядро jQuery ...................................................................33
Глава 1. Введение в jQuery .......................................................35
1.1. Больше возможностей, меньше кода ..................................36
1.2. Ненавязчивый JavaScript ................................................38
1.2.1. Отделение поведения от разметки .............................39
1.2.2. Отделение сценария ...............................................40
1.3. Основы jQuery ................................................................41
1.3.1. Обертка jQuery ......................................................41
1.3.2. Вспомогательные функции ......................................44
1.3.3. Обработчик готовности документа ............................45
1.3.4. Создание элементов DOM ........................................47
1.3.5. Расширение jQuery.................................................48
1.3.6. Сочетание jQuery с другими библиотеками ................50
1.4. Итоги ............................................................................51
Глава 2. Выбор элементов для дальнейшей работы ..................53
2.1. Отбор элементов для манипуляций ....................................54
2.1.1. Управление контекстом ..........................................56
2.1.2. Базовые селекторы CSS ...........................................58
2.1.3. Селекторы выбора потомков, контейнеров
и атрибутов ....................................................................59
2.1.4. Выбор элементов по позиции ...................................64
2.1.5. CSS и нестандартные селекторы jQuery .....................67
2.2. Создание новых элементов HTML ......................................71
2.3. Манипулирование обернутым набором элементов ................74
2.3.1. Определение размера обернутого набора элементов .....76
6 Оглавление
2.3.2. Получение элементов из обернутого набора ................77
2.3.3. Получение срезов обернутого набора элементов ..........81
2.3.4. Получение обернутого набора с учетом
взаимоотношений ...........................................................92
2.3.5. Дополнительные способы использования
обернутого набора ...........................................................94
2.3.6. Управление цепочками методов jQuery .....................95
2.4. Итоги ............................................................................98
Глава 3. Оживляем страницы с помощью jQuery .......................99
3.1. Манипулирование свойствами и атрибутами элементов ......100
3.1.1. Манипулирование свойствами элементов ................102
3.1.2. Извлечение значений атрибутов .............................103
3.1.3. Установка значений атрибутов ...............................105
3.1.4. Удаление атрибутов ..............................................107
3.1.5. Игры с атрибутами ...............................................108
3.1.6 Сохранение собственных данных в элементах ...........110
3.2. Изменение стиля отображения элемента ..........................112
3.2.1. Добавление и удаление имен классов ......................113
3.2.2. Получение и установка стилей ...............................118
3.3. Установка содержимого элемента ...................................127
3.3.1. Замена HTML-разметки или текста .........................127
3.3.2. Перемещение и копирование элементов ..................129
3.3.3. Обертывание элементов .........................................137
3.3.4. Удаление элементов .............................................139
3.3.5. Копирование элементов ........................................140
3.3.6 Замена элементов ..................................................142
3.4. Обработка значений элементов форм ...............................144
3.5. Итоги ..........................................................................147
Глава 4. События – место, где все происходит ........................148
4.1. Модель событий броузера ...............................................150
4.1.1. Модель событий DOM уровня 0 ...............................151
4.1.2. Модель событий DOM уровня 2 ...............................158
4.1.3. Модель событий Internet Explorer...........................164
4.2. Модель событий jQuery ..................................................164
4.2.1. Подключение обработчиков событий
с помощью jQuery .........................................................165
4.2.2. Удаление обработчиков событий ............................171
4.2.3. Исследование экземпляра Event .............................172
4.2.4. Упреждающая установка обработчиков событий ......175
4.2.5. Запуск обработчиков событий ................................179
4.2.6. Прочие методы для работы с событиями ..................181
4.3. Запуск событий (и не только) в работу ..............................187
4.3.1. Фильтрация больших наборов данных ....................188
Оглавление 7
4.3.2. Создание элементов по шаблону .............................190
4.3.3. Основная разметка ...............................................194
4.3.4. Добавление новых фильтров ..................................195
4.3.5. Добавление элементов для ввода
параметров фильтра ......................................................199
4.3.6. Удаление ненужных фильтров и другие операции.....201
4.3.7. Всегда можно что-то улучшить ..............................202
4.4. Итоги ..........................................................................204
Глава 5. Заряжаем страницы анимацией и эффектами ..........206
5.1. Скрытие и отображение элементов ..................................207
5.1.1. Реализация сворачиваемого «модуля» ....................208
5.1.2. Переключение состояния отображения элементов .....212
5.2. Анимационные эффекты при изменении
визуального состояния элементов .........................................213
5.2.1. Постепенное отображение и скрытие элементов ........213
5.2.2. Плавное растворение и проявление элементов ..........220
5.2.3. Закатывание и выкатывание элементов ...................224
5.2.4. Остановка анимационных эффектов .......................226
5.3. Создание собственных анимационных эффектов ...............227
5.3.1. Эффект масштабирования .....................................230
5.3.2. Эффект падения ...................................................231
5.3.3. Эффект рассеивания .............................................232
5.4. Анимационные эффекты и очереди .................................234
5.4.1. Одновременное воспроизведение
анимационных эффектов ...............................................234
5.4.2. Поочередное выполнение функций .........................237
5.4.3. Добавление функций в очередь
анимационных эффектов ...............................................244
5.5. Итоги ..........................................................................245
Глава 6. За пределы DOM с помощью
вспомогательных функций jQuery .........................................247
6.1. Флаги jQuery................................................................248
6.1.1. Запрет воспроизведения анимационных эффектов .....249
6.1.2. Определение типа броузера ....................................249
6.1.3. Флаги, определяющие тип броузера ........................254
6.2. Применение других библиотек совместно с jQuery .............257
6.3. Управление объектами и коллекциями JavaScript .............261
6.3.1. Усечение строк ....................................................261
6.3.2. Итерации по свойствам и элементам коллекций .......262
6.3.3. Фильтрация массивов ...........................................264
6.3.4. Преобразование массивов ......................................266
6.3.5. Другие полезные функции для работы
с массивами JavaScript ..................................................269
8 Оглавление
6.3.6. Расширение объектов ...........................................271
6.3.7. Сериализация значений параметров .......................274
6.3.8. Проверка типов объектов ......................................278
6.4. Различные вспомогательные функции .............................279
6.4.1. Пустая операция ..................................................279
6.4.2. Проверка на вхождение ........................................280
6.4.3. Присоединение данных к элементам .......................280
6.4.4. Предварительная установка контекста функции ......281
6.4.5. Синтаксический анализ строк в формате JSON .........285
6.4.6. Вычисление выражений ........................................286
6.4.7. Динамическая загрузка сценариев .........................287
6.5. Итоги ..........................................................................290
Глава 7. Расширение jQuery с помощью
собственных модулей ...........................................................292
7.1. Зачем нужны расширения? ............................................293
7.2. Основные правила создания модулей расширения jQuery ....294
7.2.1. Именование функций и файлов ..............................294
7.2.2. Остерегайтесь $ ...................................................296
7.2.3. Укрощение сложных списков параметров ................296
7.3. Создание собственных вспомогательных функций .............299
7.3.1. Создание вспомогательной функции
для манипулирования данными ......................................301
7.3.2. Создание функции форматирования даты ................303
7.4. Добавление новых методов обертки .................................307
7.4.1. Применение нескольких операций
в методах обертки .........................................................310
7.4.2. Сохранение состояния внутри метода обертки ..........315
7.5. Итоги ..........................................................................329
Глава 8. Взаимодействие с сервером по технологии Ajax ........330
8.1. Знакомство с Ajax .........................................................331
8.1.1. Создание экземпляра XHR ....................................332
8.1.2. Инициализация запроса ........................................334
8.1.3. Слежение за ходом выполнения запроса ..................336
8.1.4. Получение ответа .................................................336
8.2. Загрузка содержимого в элемент .....................................338
8.2.1. Загрузка содержимого с помощью jQuery ................340
8.2.2. Загрузка динамических данных .............................343
8.3. Выполнение запросов GET и POST ...................................348
8.3.1. Получение данных методом GET ............................351
8.3.2. Получение данных в формате JSON ........................353
8.3.3. Выполнение запросов POST ...................................354
8.3.4. Каскады раскрывающихся списков ........................356
Оглавление 9
8.4. Полное управление запросами Ajax .................................362
8.4.1. Выполнение запросов Ajax со всеми настройками ......363
8.4.2. Настройка запросов, используемых по умолчанию ....366
8.4.3. Обработка событий Ajax .......................................368
8.5. Соединяем все вместе ....................................................372
8.5.1. Реализация всплывающей подсказки......................374
8.5.2. Опробование расширения Termifier ........................380
8.5.3. Место для усовершенствований ..............................384
8.6. Итоги ..........................................................................385
Часть II. jQuery UI .....................................................................387
Глава 9. Введение в jQuery UI: оформление и эффекты ...........389
9.1. Настройка и загрузка библиотеки jQuery UI .....................391
9.1.1. Настройка и загрузка ...........................................391
9.1.2. Использование библиотеки jQuery UI ......................392
9.2. Темы оформления в jQuery .............................................394
9.2.1. Обзор ..................................................................395
9.2.2. Использование инструмента ThemeRoller ................399
9.3. Эффекты jQuery UI .......................................................401
9.3.1. Эффекты jQuery UI ...............................................402
9.3.2. Расширенные возможности
базовых анимационных эффектов ...................................409
9.3.3. Расширения методов управления видимостью ..........410
9.3.4. Расширения методов управления классами .............411
9.3.5. Функции перехода ...............................................413
9.4. Улучшенный механизм позиционирования ......................416
9.5. Итоги ..........................................................................420
Глава 10. Механизмы взаимодействий jQuery UI с мышью .......421
10.1. Перетаскивание объектов .............................................423
10.1.1. Добавление способности к перетаскиванию ............425
10.1.2. События, возникающие
в процессе перетаскивания .............................................433
10.1.3. Управление способностью к перетаскиванию ..........434
10.2. Отпускание перетаскиваемых элементов ........................436
10.2.1. Добавление способности к приему
перетаскиваемых элементов ...........................................437
10.2.2. События отпускания элементов ............................441
10.3. Переупорядочение элементов ........................................446
10.3.1. Добавление способности к переупорядочению .........448
10.3.2. Подключение сортируемых списков ......................453
10.3.3. События переупорядочения .................................454
10.3.4. Получение информации
о порядке следования элементов .....................................456