Классы

Ну, вроде с CSS разобрались, хотя нет — стоит ещё описать манипуляции с классами, тоже из разряда первичных навыков:

addClass(className) — добавление класса элементу

addClass(function(index, currentClass){ return className }) — добавление класса с помощью функции обратного вызова

hasClass(className) — проверка на причастность к определённому классу

removeClass(className) — удаление класса

removeClass(function(index, currentClass){ return className }) — удаление класса с помощью функции обратного вызова

toggleClass(className) — переключение класса

toggleClass(className, switch) — переключение класса по флагу switch

toggleClass(function(index, currentClass, switch){ return className }, switch) — переключение класса с помощью функции обратного вызова

В приведённых методах в качестве «className» может быть строка, содержащая список классов через пробел.

Мне ни разу не приходилось использовать данные методы с функциями обратного вызова, и лишь единожды пригодился флаг «switch», так что не заморачивайтесь всё это запоминать, да и в дальнейшем, цитируя руководство по jQuery, я буду сознательно опускать некоторые «возможности».

Но хватит заниматься переводом официальной документации, перейдём к наглядным примерам:

$("#my").addClass("active") - добавляем класс «active»

$("#my").addClass("active notice") - добавляем несколько классов за раз

$("#my").toggleClass("active") - переключаем класс «active»

$("#my").toggleClass("active notice") - переключаем несколько классов

Работает переключение классов следующим образом (это похоже на классовый XOR):

<div id="my" class="active notice"> → <div id="my" class="">

<div id="my" class="active"> → <div id="my" class="notice">

<div id="my" class=""> → <div id="my" class="active notice">

$("#my").removeClass("active")- удаляем класс «active»

$("#my").removeClass("active notice")- удаляем несколько классов