JavaScript. Подробное руководство, 6-е издание, стр. 294

Эта глава начинается с введения в библиотеку jQuery, где будет показано, как выполнять простейшие запросы и как обрабатывать результаты. В последующих разделах описывается:

• Как изменять HTML-атрибуты, стили и классы CSS, значения и содержимое элементов HTML-форм, управлять геометрией и данными

• Как изменять структуру документа, вставляя, замещая, обертывая и удаляя элементы

• Как использовать модель событий библиотеки jQuery, совместимую со всеми броузерами

• Как с помощью jQuery воспроизводить анимационные визуальные эффекты

• Как выполнять HTTP-запросы с помощью механизма поддержки архитектуры Ajax, реализованном в библиотеке jQuery

• Вспомогательные функции jQuery

• Полный синтаксис селекторов jQuery, и как использовать расширенные методы поиска из библиотеки jQuery

• Как расширять библиотеку jQuery, создавая и используя расширения

• Библиотека jQuery UI

19.1. Основы jQuery

Библиотека jQuery определяет единственную глобальную функцию с именем

. Эта функция используется настолько часто, что библиотека определяет также глобальное имя $, как сокращенный псевдоним этой функции. Эти два имени - все, что библиотека jQuery добавляет в глобальное пространство имен. [53]

Эта глобальная функция с двумя именами является центральной функцией механизма запросов в библиотеке jQuery. Например, ниже показано, как можно запросить множество всех элементов

в документе:

Эта функция возвращает множество из нуля или более элементов DOM, которое называется объектом

. Обратите внимание, что является фабричной функцией, а не конструктором: она возвращает вновь созданный объект, но она используется без ключевого слова . Объект определяет множество методов для выполнения операций над множеством элементов, которое он представляет, и большая часть главы будет посвящена описанию этих методов. Ниже приводится пример инструкции, которая отыскивает, выделяет цветом и быстро отображает все скрытые элементы имеющие класс «details»:

Метод

оперирует объектом , возвращаемым функцией , и возвращает этот же объект, благодаря чему метод может быть вызван в этой же компактной «цепочке вызовов методов». Этот прием составления цепочек является весьма характерным при использовании библиотеки jQuery. В качестве другого примера ниже демонстрируется инструкция, выполняющая поиск всех элементов, имеющих CSS-класс «clicktohide», и регистрирующая обработчик события в каждом из них. Этот обработчик вызывается, когда пользователь щелкает на элементе и заставляет элемент медленно «выезжать» за границы окна вверх и скрываться:

19.1.1. Функция jQuery()

Функция

(она же ) является наиболее важной в библиотеке jQuery. Однако она существенно перегружена и может быть вызвана четырьмя разными способами.

Первый и наиболее типичный способ вызова

предусматривает передачу ей CSS-селектора (строки). При вызове таким способом она возвращает множество элементов из текущего документа, соответствующих селектору. Библиотека в значительной степени поддерживает синтаксис селекторов CSS3 плюс некоторые собственные расширения. Более подробное описание синтаксиса селекторов jQuery приводится в разделе 19.8.1. Если во втором аргументе передать функции элемент или объект , она вернет только элементы-потомки указанного элемента или элементов, соответствующие селектору. Этот необязательный второй аргумент определяет начальную точку (или точки) выполнения запроса и часто называется контекстом.

При втором способе вызова функции

передается объект или . Подобный вызов просто обертывает элемент, документ или окно объектом и возвращает его. Это дает возможность манипулировать элементом с помощью методов объекта вместо низкоуровневых методов модели DOM. Например, в программах, использующих библиотеку jQuery, часто можно встретить вызов или Объекты могут представлять множество элементов документа, а кроме того, функции можно передавать массив элементов. В этом случае возвращаемый объект будет представлять множество элементов, имевшихся в массиве.

Библиотека jQuery является свободно распространяемым программным обеспечением. Ее можно загрузить с сайта http:_t//jquery.com. Получив библиотеку, вы сможете подключать ее к своим веб-страницам с помощью элемента <script>, как показано ниже:

Слово «min» в имени файла выше указывает, что используется минимизированная версия библиотеки, из которой были удалены комментарии и лишние пробелы, а внутренние идентификаторы были заменены более короткими именами.

Другой способ задействовать библиотеку jQuery в своих веб-приложениях заключается в использовании сети распространения библиотеки, для чего достаточно указать любой из следующих URL-адресов:

http://code.jqueгу.com/jquery-1.4.2.min.js

http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js

http://ajax.googleapis.eom/ajax/libs/jquery/1.4.2/jquery.min.js