본문 바로가기

Frontend/Javascript

CSS in Javascript

 

처음에 newColor라는 빈 let변수를 선언했고 if, else를 거치면서 초기화 값을 할당받게 된다.
즉, newColor = "tomato"; 이런식으로 된다.

그리고 그 값을 h1에 넣어주는 것이기 때문에 h1.style.color = newColor;가 됨.

 

css를 이용하기.

html에 js와 css가 import되어있어야함.

"clicked"와 같은 raw string이 반복되면 상수로 만들어 줄 것(→clickedClass)

 

 

다른 className을 만들더라도

classList를 사용하면 추가한 className을 유지한 채로 clicked를 실행할 수 있음

 

 

결과적으로 "toggle"이라는 function이 위의 모든 함수를 한줄로 대신해준다!

'Frontend > Javascript' 카테고리의 다른 글

Clock  (0) 2021.12.25
Form Submission  (0) 2021.12.23
Events listening  (0) 2021.12.20
HTML in Javascript  (0) 2021.12.20
Conditionals  (0) 2021.12.18