Javascript_06: 스타일 접근하기 classList, className

style 프로퍼티를 이용해 스타일에 접근할 수 있다

today.children[0].style.textDecoration = 'line through';

*text-decoration이 아닌 textDecoration, background-color가 아닌 backgroundColor로 접근한다 [카멜표기법]

요소.style.속성 = ' 속성값 ' ;

 

하지만 여러 개의 요소의 스타일을 변경하기는 매우 번거롭다

= 스타일형식을 클래스 안에 넣고 해당 클래스를 적용한다

클래스를 적용하는 방법은 크게 두가지가 있다
클래스 전체를 덮어씌우거나 일부분을 변경하는 방법이다

style을 클래스 형식으로 적용하기
전체를 덮어씌운다(className)	element.className = 'name';	원래 클래스는 지워지고 'name'으로 교체
클래스 일부분을 적용한다 (classList)	element.classList.add('name','name2');	요소에 name, name2 클래스를 추가한다
	element.classList.remove('n1','n2');	요소의 n1, n2클래스를 삭제한다
	element.classList.toggle('name')	요소에 name이 없으면 추가, 있으면 삭제
	element.classList.toggle('name', true)	추가 기능만 한다. false면 삭제 기능만 한다
	element.classList.contains('name');	해당 클래스가 있는지 확인한다