Element.className
개요
className 특정 엘리먼트의 클래스 속성의 값을 가져오거나 설정할 수 있다.
문법
var cName = elementNodeReference.className; elementNodeReference.className = cName;
- cName은 현재 요소의 클래스 혹은 공백으로 구분된 클래스들을 표현하는 문자열 변수이다.
예제
let elm = document.getElementById('item');
if(elm.className === 'active'){
elm.className = 'inactive';
} else {
elm.className = 'active';
}주의
많은 언어에서 DOM 조작을 위해 사용되는 "class " 키워드와의 혼란을 줄이기 위하여 class 대신 className이라는 프로퍼티 명을 사용한다.
명세
| 명세서 | 상태 | 주석 |
|---|---|---|
| DOM The definition of 'element.className' in that specification. |
Living Standard | |
| DOM4 The definition of 'element.className' in that specification. |
Obsolete | |
| Document Object Model (DOM) Level 2 HTML Specification The definition of 'element.className' in that specification. |
Obsolete | Initial definition |
브라우저 호환성
We're converting our compatibility data into a machine-readable JSON format.
This compatibility table still uses the old format,
because we haven't yet converted the data it contains.
Find out how you can help!
| Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Basic support | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) |
| Feature | Android | Chrome for Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|
| Basic support | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) |