스타일과 클래스

• JS 로 DOM style 프로퍼티와 style 프로퍼티 둘 다 수정

• CSS 에 관련된 작업은 스타일을 명시한 클래스 만들고 JS 이용해 이 클래스를 요소에 추가하는 방식 사용시 유연성 확보돼 유지보수 쉬워짐

• className 메서드로 해당 DOM의 클래스 전체를 문자열 형태로 반환

• classList 메서드로 해당 DOM의 클래스 하나를 관리할 수 있으며 add/remove/toggle/contains 가 구현된 객체 반환 (개별 클래스 조작)

• 스타일 변경 방법은 카멜 표기법 이용해 변경한 스타일이 있는 style 프로퍼티 조작하는 것으로 “style” 속성과 대응하는 개별 프로퍼티 조작하는 것과 style.cssText 프로퍼티 로 “style” 속성 전체에 대응된 문자열 전체가 저장된 것을 관리하는 방법 있음

• styled 프로퍼티는 html 태그 의 style 속성 값만 읽을 수 있으며 CSS 종속(CSS cascade) 값 다룰 수 없음

• CSS 는 CSS 규칙, CSS 상속이 모두 적용된 후의 값인 계산값과 요소에 최종적으로 적용되는 값인 결정값으로 나뉨

• getComputedStyle(element, [pseudo]) 로 스타일 결정값을 읽을 수 있으며 스타일 정보가 들어 있는 객체 반환. (읽기 전용) element 는 값을 읽을 요소, pseudo 는 의사 요소가 필요한 경우 명시 해줌(생략 가능). 프로퍼티 이름 전체를 정확히 알고 있어야 원하는 값 얻을 수 있음