JS내에서 사용하는 obejct.className = "cssClass"를 볼 때, className 은 getter이자 setter이다.
아래와 같은 방식은 JS와 CSS가 직접 대화하지 않는다, 대신 JS는 HTML을 변경하고 CSS는 HTML을 바라보고 있어서, HTML을 매개로 JS -(HTML)-> CSS로 이어지는 동작을 수행하게 된다.
<body>
<div class="hello">
<h1 id="title1">It's me!</h1>
<h1 id="title2">It's me!</h1>
</div>
</body>
.active{ /* CSS클래스 active 정의*/
color : tomato;
}
const h1 = document.querySelector(".hello:first-chile h1");
h1.className = "active"; // h1 오브젝트에 CSS클래스 active내에서 할당한 스타일명세 데이터를 전달했음