3.6~3.8
element
찾기event
를listen
하기event
에 반응하기▶️ CSS로 스타일을, JS에서는 애니메이션설정을 하는것 추천
.active{ background-color: purple}
태그이름.className ="classname"
h1.className = "active"
태그이름.className ="classname"
은 class 를 가져올수도, 변경해 줄 수도있다. ▶️ classlist
는className
과 달리, class목록으로 작업할 수 있기 때문에 class를 유지 / 추가 / 삭제 모두가능하다.
.contain()
= 해당 class가 적용되어 있는지 확인하여 boolean값을 리턴..remove()
= 해당 class를 제거..add()
= 해당 class를 추가▶️ class가 적용되어 있으면 제거, 없으면 추가해줌
h1.classList.toggle('class이름')
포인트!!
▶️ JS로 html태그에 class 추가 /제거하기
▶️ window의 넓이는 window.innerWidth
▶️ if / else if 사용