class 추가, 삭제, 토글 javaScript

 

classList.add

요소에 클래스 추가

element.classList.add('className');

//여러개 클래스도 추가가능하다 (IE11 지원안함)
element.classList.add('className1', 'className2', 'className3');

 

classList.remove

요소로부터 해당 클래스 제거

element.classList.remove('className');

// 여러개 클래스 제거 (IE 11 지원안함)
element.classList.remove('className1', 'className2', 'className3');

 

 

classList.toggle

클래스 토글 기능

element.classList.toggle('className');

 

 

예제 코드

 

 

See the Pen add or remove by kim oya (@ttuttu) on CodePen.