Добавление и удаление класса в Jquery
Для добавления классов к элементу в jquery есть функция addClass(), работа её очень простая, рассмотрим на примере:
Добавление класса
$("#block").addClass("class");
$(".block").addClass("class");
Мы к элементу block добавляем класс class. Мы можем добавлять классы, как по id, так и по классу.
Есть возможность добавлять сразу несколько классов:
$("#block").addClass("class1 class2");
Рассмотрим пример. Создадим белый блок с чёрной рамкой и добавим к нему класс, который окрасит его в красный цвет.
<html>
<head>
<style>
#block{
width: 50px;
height: 50px;
border: 1px solid #000;
}
.red{
background-color: red;
}
</style>
</head>
<body>
<script src="js/jquery.min.js"></script>
</body>
</html>
Удаление класса
Для удаления класса в jquery есть функция removeClass, которая работает аналогично с классом выше, рассмотрим на примере:
$("#block").removeClass("class");
$(".block").removeClass("class");
Удаляем классы у элемента block, также можно удалять несколько классов:
$("#block").removeClass("class1 class2");
Есть возможность удалить все классы, для этого функции мы не передаём параметров:
$("#block").removeClass();
Пример работы. Удалим у нашего блока класс, который делает его красным цветом:
<html>
<head>
<style>
#block{
width: 50px;
height: 50px;
border: 1px solid #000;
}
.red{
background-color: red;
}
</style>
</head>
<body>
<script src="js/jquery.min.js"></script>
</body>
</html>
E-mail: 
Telegram:
Оставить комментарий