jQuery в действии

Содержание

Часть I. Начинаем работу с jQuery

Глава 1. Знакомство с jQuery 29
1.1. Пишите меньше, делайте больше 30
1.2. Ненавязчивый JavaScript 32
1.2.1. Отделение поведения от структуры 33
1.2.2. Отделение сценария 33
1.3. Установка jQuery 35
1.3.1. Выбор правильной версии 35
1.3.2. Улучшение производительности с помощью CDN 38
1.4. Структура jQuery 39
1.5. Основы jQuery 41
1.5.1. Свойства, утилиты и методы 41
1.5.2. Объект jQuery 42
1.5.3. Обработчик готовности документа 44
1.6. Резюме 46

Часть II. Основы jQuery

Глава 2. Выбор элементов 49
2.1. Выбор элементов для манипуляции 50
2.2. Базовые селекторы 52
2.2.1. Универсальный селектор 53
2.2.2. Селектор ID 56
2.2.3. Селектор класса 56
2.2.4. Селектор элементов 57
2.3. Получение элементов по их иерархии 58
2.4. Выбор элементов с помощью атрибутов 60
2.5. Введение в фильтры 64
2.5.1. Фильтры позиции 64
2.5.2. Фильтры-потомки 66
2.5.3. Фильтры формы 69
2.5.4. Фильтры содержимого 70
2.5.5. Другие фильтры 71
2.5.6. Как создать пользовательские фильтры 73
2.6. Улучшение производительности с использованием контекста 76
2.7. Проверьте свои навыки с помощью упражнений 78
2.7.1. Упражнения 78
2.7.2. Решения 78
2.8. Резюме 79

Глава 3. Операции с коллекцией jQuery 80
3.1. Добавление нового HTML-кода 80
3.2. Управление коллекцией jQuery 83
3.2.1. Определение размера набора 85
3.2.2. Получение элементов из набора 86
3.2.3. Получение наборов с использованием отношений 91
3.2.4. Вырезки и перетасовки набора 95
3.2.5. Еще больше способов использования набора 104
3.3. Резюме 107

Глава 4. Работа со свойствами, атрибутами и данными 108
4.1. Определение свойств элементов и атрибутов 109
4.2. Работа с атрибутами 112
4.2.1. Извлечение значений атрибутов 112
4.2.2. Установка значений атрибутов 114
4.2.3. Удаление атрибутов 116
4.2.4. Игры с атрибутами 116
4.3. Манипулирование свойствами элементов 118
4.4. Хранение пользовательских данных в элементах 121
4.5. Резюме 129

Глава 5. Оживляем страницы с помощью jQuery 130
5.1. Изменение стилей элемента 131
5.1.1. Добавление и удаление имен классов 131
5.1.2. Получение и установка стилей 136
5.2. Доступ к содержимому элемента 145
5.2.1. Замена HTML и текстового содержимого 146
5.2.2. Перемещение элементов 148
5.2.3. Обертывание элементов и удаление обертки 154
5.2.4. Удаление элементов 158
5.2.5. Клонирование элементов 160
5.2.6. Замена элементов 161
5.3. Обработка значений элементов форм 163
5.4. Резюме 165

Глава 6. События и где они происходят 166
6.1. Модели обработки событий в браузерах 168
6.1.1. Модель событий DOM уровня 0 168
6.1.2. Модель событий DOM уровня 2 176
6.1.3. Модель событий в Internet Explorer 182
6.2. Модель событий jQuery 182
6.2.1. Назначение обработчиков событий в jQuery 183
6.2.2. Удаление обработчиков событий 190
6.2.3. Внутри экземпляра Event 193
6.2.4. Запуск обработчиков событий 195
6.2.5. Сокращенные методы 200
6.2.6. Создание пользовательских событий 204
6.2.7. События в пространствах имен 204
6.3. Резюме 206

Глава 7. Демоверсия: локатор DVD 208
7.1. Размещение событий (и не только) для работы 208
7.1.1. Фильтрация наборов данных больших объемов 209
7.1.2. Создание элементов с помощью репликации шаблона 210
7.1.3. Настройка основной разметки 214
7.1.4. Добавление новых фильтров 215
7.1.5. Добавление шаблонов для элементов управления 219
7.1.6. Удаление ненужных фильтров и другие задачи 220
7.1.7. Отображение результатов 220
7.1.8. Всегда есть куда расти 223
7.2. Резюме 224

Глава 8. Наполняем страницы анимацией и эффектами 225
8.1. Отображение и скрытие элементов 226
8.1.1. Реализация сворачиваемого «модуля» 227
8.1.2. Отображение состояния элементов 230
8.2. Анимация отображения состояния элементов 230
8.2.1. Постепенное отображение и скрытие элементов 231
8.2.2. Знакомство со страницей jQuery Effects Lab 236
8.2.3. Плавное растворение и проявление элементов 238
8.2.4. Закатывание и выкатывание элементов 240
8.2.5. Остановка анимации 241
8.3. Добавление смягчающих функций jQuery 243
8.4. Создание собственных анимационных эффектов 246
10 Оглавление
8.4.1. Анимация пользовательского масштабирования 248
8.4.2. Пользовательский эффект падения 249
8.4.3. Пользовательский эффект рассеивания 250
8.5. Анимации и очереди 253
8.5.1. Одновременные анимации 253
8.5.2. Очереди функций для выполнения 255
8.5.3. Добавление функций в очередь анимационных эффектов 262
8.6. Резюме 263

Глава 9. За пределы DOM с помощью вспомогательных функций jQuery 265
9.1. Применение флагов jQuery 266
9.1.1. Запрет воспроизведения анимационных эффектов 267
9.1.2. Изменение скорости воспроизведения анимаций 267
9.1.3. Свойство $.support 268
9.2. Использование других библиотек совместно с jQuery 269
9.3. Управление объектами и коллекциями JavaScript 274
9.3.1. Усечение строк 274
9.3.2. Итерации по свойствам и элементам коллекций 275
9.3.3. Фильтрация массивов 278
9.3.4. Преобразование массивов 279
9.3.5. Другие полезные функции для работы с массивами JavaScript 281
9.3.6. Расширение объектов 284
9.3.7. Сериализация значений параметров 287
9.3.8. Проверка объектов 291
9.3.9. Анализ функций 295
9.4. Различные вспомогательные функции 297
9.4.1. Пустая операция 298
9.4.2. Проверка на вхождение 298
9.4.3. Предварительная установка контекста функции 299
9.4.4. Выполнение выражений 302
9.4.5. Проброс исключений 303
9.5. Резюме 304

Глава 10. Взаимодействие с сервером по технологии Ajax 305
10.1. Знакомство с Ajax 306
10.1.1. Создание экземпляра XHR 306
10.1.2. Инициализация запроса 309
10.1.3. Отслеживание выполнения запроса 310
10.1.4. Получение ответа 310
10.2. Загрузка содержимого в элементы 311
10.2.1. Загрузка содержимого с помощью jQuery 313
10.2.2. Загрузка динамических фрагментов HTML 317
10.3. Выполнение запросов GET и POST 322
10.3.1. Получение данных методом GET 324
10.3.2. Получение данных в формате JSON 326
10.3.3. Динамическая загрузка сценариев 327
10.3.4. Создание запросов POST 329
10.3.5. Реализация каскадов раскрывающихся списков 330
10.4. Полное управление запросами Ajax 336
10.4.1. Выполнение запросов Ajax со всеми настройками 336
10.4.2. Настройка запросов, используемых по умолчанию 341
10.4.3. Обработка событий Ajax 342
10.4.4. Продвинутые вспомогательные функции Ajax 346
10.5. Резюме 349

Глава 11. Демонстрационный пример: форма контакта, основанная на технологии Ajax 350
11.1. Функциональные возможности проекта 351
11.2. Создание разметки 353
11.3. Реализация серверной части на PHP 354
11.4. Проверка полей с использованием Ajax 356
11.5. Еще больше веселья с Ajax 359
11.6. Улучшение пользовательского опыта с помощью анимационных эффектов 361
11.7. Замечание о доступности 362
11.8. Резюме 364

Часть III. Дополнительные возможности

Глава 12. jQuery не справляется? Помогут плагины! 367
12.1. Зачем нужны плагины jQuery 367
12.2. Где искать плагины 368
12.2.1. Как использовать хорошо написанный плагин 369
12.2.2. Отличные плагины для ваших проектов 372
12.3. Руководство по созданию плагинов jQuery 373
12.3.1. Соглашения об именах файлов и функций 374
12.3.2. Осторожно: $ 375
12.3.3. Укрощение сложных списков параметров 375
12.3.4. Единое пространство имен 378
12.3.5. Пространства имен для событий и данных 381
12.3.6. Поддержка цепочек 386
12.3.7. Перенос стандартных значений в открытый доступ 386
12.4. Демонстрационный пример: создание слайд-шоу в виде плагина jQuery 389
12.4.1. Создание разметки 392
12.4.2. Разработка Jqia Photomatic 394
12.5. Создание сервисных функций 402
12.6. Резюме 407

Глава 13. Предотвращение появления callback hell с помощью Deferred 408
13.1. Введение в промисы 409
13.2. Объекты Deferred и Promise 412
13.3. Методы Deferred 413
13.3.1. Выполнение или отклонение Deferred 414
13.3.2. Выполнение функций после разрешения или отклонения 416
13.3.3. Метод when() 419
13.3.4. Уведомление о прогрессе Deferred 422
13.3.5. Следим за прогрессом 423
13.3.6. Использование объекта Promise 425
13.3.7. Упростим код, используя then() 428
13.3.8. Всегда запускайте обработчик 432
13.3.9. Определение состояния Deferred 433
13.4. Промисификация всего на свете 433
13.5. Резюме 435

Глава 14. Модульное тестирование с jQuery 437
14.1. Почему тестирование важно 438
14.1.1. Почему модульное тестирование? 439
14.1.2. Фреймворки для модульного тестирования JavaScript 441
14.2. Начинаем работу с QUnit 442
14.3. Создание тестов для синхронного кода 445
14.4. Тестирование кода с использованием утверждений 447
14.4.1. equal(), strictEqual(), notEqual() и notStrictEqual() 447
14.4.2. Другие методы утверждений 451
14.4.3. Метод утверждений throws() 452
14.5. Как тестировать асинхронные задачи 453
14.6. noglobals и notrycatch 456
14.7. Группировка тестов в модулях 458
14.8. Конфигурирование QUnit 459
14.9. Пример набора тестов 461
14.10. Резюме 465

Глава 15. jQuery в больших проектах 467
15.1. Повышение производительности селекторов 468
15.1.1. Избегайте универсального селектора 469
15.1.2. Дополняйте селектор Class 469
15.1.3. Не злоупотребляйте параметром context 470
15.1.4. Оптимизация с помощью фильтров 471
15.1.5. Не перегружайте селекторы 472
15.2. Разделение кода на модули 473
15.2.1. Шаблон объектных литералов 474
15.2.2. Шаблон Module 475
15.3. Загрузка модулей с помощью RequireJS 477
15.3.1. Начало работы с RequireJS 478
15.3.2. Использование RequireJS с jQuery 479
15.4. Управление зависимостями с помощью Bower 481
15.4.1. Начало работы с Bower 481
15.4.2. Поиск пакетов 483
15.4.3. Установка, обновление и удаление пакетов 484
15.5. Создание одностраничных приложений с помощью Backbone.js 485
15.5.1. Зачем нужны MV-фреймворки 487
15.5.2. Начало работы с Backbone.js 488
15.5.3. Создание приложения Todos manager с помощью Backbone.js 492
15.6. Резюме 503
15.7. Конец 504

Приложения

Приложение. То, что стоит знать и чего вы, возможно, не знаете о JavaScript! 506
Основные сведения об объектах в JavaScript 507
Как создаются объекты 507
Свойства объектов 507
Объектные литералы 510
Объекты как свойства window 511
Функции как объекты первого класса 511
Функциональные выражения и объявления функций 512
Функции как обратные вызовы 514
Что такое this 515
Замыкания 519
Функциональные выражения немедленного вызова 522
Резюме 524