Элемент: свойство className
Базовая Широко доступная
Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна во всех браузерах с июля 2015 года.
Свойство className интерфейса Element получает и устанавливает значение атрибута class указанного элемента.
Значение
Строковая переменная, представляющая класс или разделенные пробелами классы текущего элемента.
Примеры
const el = document.getElementById("item");
el.className = el.className === "active" ? "inactive" : "active";
Примечания
Имя className используется для этого свойства вместо class, из-за конфликтов с ключевым словом "class" во многих языках, используемых для манипулирования DOM.
className также может быть экземпляром SVGAnimatedString, если element является SVGElement. Получение/установка атрибута class элемента проще с помощью Element.getAttribute и Element.setAttribute, если вы работаете с SVG-элементами. Однако учтите, что Element.getAttribute возвращает null вместо "" , если у element есть пустой class атрибут.
elm.setAttribute("class", "my-class");
const myClass = elm.getAttribute("class");
Примечание: class — это название HTML-атрибута, а className — название DOM-свойства.
Спецификации
| Спецификация |
|---|
| DOM # ref-for-dom-element-classname① |
Совместимость браузеров
| Рабочие столы | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на iOS | Samsung Internet | WebView Android | |
className |
22 | 12 | 1 | 8 | 1 | 25 | 4 | 10.1 | 1 | 1.5 | 4.4 |
См. также
© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Element/className
