tag의 class 조작하기

태그의 클래스 정보 가져오기

classVal = $tag.className;

태그에서 복수의 클래스 정보 가져오기

classArr = $tag.classList;

해당 태그에 특정 클래스가 있는지 확인하기

tag.classList.contains('class');

: 해당 클래스가 들어있다면 true, 들어 있지 않다면 false를 반환한다.

예시 코드

const $screen = document.querySelector('#screen');
const $result = document.querySelector('#result');

$screen.addEventListener('click', (event) => {
  if ($screen.classList.contains('waiting')) {
  } else if ($screen.classList.contains('ready')) {
  } else if ($screen.classList.contains('now')) {
  }

class C,U,D

class 추가하기

태그.classList.add('클래스'); // class 추가

class 수정하기

태그.classList.replace('기존클래스', '수정클래스'); // class 수정

class 제거하기

태그.classList.remove('클래스'); // class 제거하기