Пожалуйста, форматируйте свой код! (
http://javascript.ru/formatting)
У элемента может быть установлен аттрибут
class, который (ввиду зарезервированности слова) преобразуется в свойство
.className.
В этом аттрибуте может содержаться любой текст — значение свойства.
Далее выборка производится по селектору, по синтаксису напоминающему на css-ный.
$(".my-class-name")
Если в тексте, содержащемся в аттрибуте
class, будучи разделенным по проблельным символам, встречается "my-class-name", то элемент соответствует выборке.
При этом точка — это конструкция селектора. Функционально вышеприведенный код такой же, как и эти два:
$("*.my-class-name");
$("*[class~=my-class-name]")
Например,
<div class="foo bar my-class-name baz"></div> <!-- будет выбран -->
<div class="foo bar baz"></div> <!-- не будет выбран -->
Таким образом, у каждого элемента могут быть своего рода «метки», не зависящие друг от друга, но от которых сильно зависит поведение элемента. Было бы удобно менять их независимо, а не работать со значением аттрибута как со строкой. Для этого и используются методы
addClass и
removeClass.
Например,
$(…).attr("class", "foo bar"); // теперь у элемента два «класса», foo и bar;
$(…).addClass("baz"); // а теперь — три: foo, bar и baz;
$(".foo.bar.baz"); // но выборка производится все равно, с точкой, потому что это конструкция языка в селекторе