Как сделать - Добавить класс
Узнайте, как добавить имя класса к элементу с помощью JavaScript.
Добавить класс
Шаг 1) добавить HTML:
Добавьте имя класса в элемент div с идентификатором = "myDIV" (в этом примере мы используем кнопку для добавления класса).
Пример
<button onclick="myFunction()">Try it</button>
<div id="myDIV">
This is a DIV element.
</div>
Шаг 2) добавить CSS:
Стиль указанное имя класса:
Пример
.mystyle {
width: 100%;
padding:
25px;
background-color: coral;
color: white;
font-size: 25px;
}
Шаг 3) добавить JavaScript:
Получите элемент <div> с идентификатором = "myDIV" и добавьте в него класс "myStyle":
Пример
function myFunction() {
var element = document.getElementById("myDIV");
element.classList.add("mystyle");
}
Кросс-браузерное решение
Примечание: Свойство класслист не поддерживается в обозревателе Internet Explorer 9. Следующий код будет работать во всех браузерах:
Пример
function myFunction() {
var element, name, arr;
element = document.getElementById("myDIV");
name = "mystyle";
arr = element.className.split(" ");
if (arr.indexOf(name)
== -1) {
element.className += "
" + name;
}
}
Совет: Также посмотрите, как переключить класс.
Совет: Также Узнайте, как удалить класс.
Совет: Узнайте больше о свойстве класслист в нашей ссылке на JavaScript.
Совет: Узнайте больше о свойстве класса в нашей сппавка на JavaScript.