Лекция №2. Выборка jQuery. Показ и скрытие элементов

Для отбора элементов документа и дальнейшей работы с ними используются методы JavaScript getElementByiD () и getElementByTagName (), однако эти методы не позволяют легко сделать сложную выборку.

С другой стороны, в CSS используются сложные селекторы.

В jQuery для отбора элементов HTML-документов используются селекторы CSS, и выборка записывается так:

$('селектор')

Селектором, как и в CSS может быть: тег, идентификатор, класс, а так же более сложные селекторы:

$('a'); //отбираются все ссылки
$('.panel') // отбираются все элементы с классом panel
$('#panel1'); // отбирается элемент с идентификатором panel1
$('а.gallery') // отбираются ссылки с классом gallery

Выборка jQuery не является массивом JavaScript, не является она и коллекцией, получаемой методами getElementByld (), getElementByTagName (). Это специфическое образование jQuery.

Специфичность выборки jQuery проявляется в правилах её использования.

Использование выборки jQuery и функций jQuery:

Простейшими функциями для управления элементами документа являются:

hide ();
show ();
fadeIn ();
fadeOut ();

Для их использования достаточно после выборки поставить точку и записать нужную функцию.

Специфичность выборки jQuery заключается в том, что заданная функция будет автоматически применена ко всем отобранным элементам, и не надо писать цикл обработки, как для обработки массива.

$('p').fadeOut (250); скрыть плавно абзацы за 250 мс
$('p').fadeIn (250); показать плавно абзацы за 250 мс