[WEB2 - JavaScript] section5 조건문

 

인프런 14강 "조건문 예고"

 

 

이전 코드의 경우 'Night' 버튼 클릭 시 어두운 모드, 'Day' 버튼 클릭 시 밝은 모드가 되었는데, 

두 개의 버튼이 존재하는 것이 깔끔하지 않아 보일 수도 있어 조건문 사용하여 두 가지 역할을 하는 토글 기능하는 버튼 생성

 

토글이란?

- 두 가지 상태 밖에 없는 상황에서, 스위치를 누르면 어떠한 값이 되고, 다시 한 번 누르면 다른 값으로 변하는 것 의미

- www.terms.co.kr/toggle.htm 정의 참고

 

 

- 토글 버튼 추가

 

위의 코드 실행 시

    - 처음에는 버튼 이름이 'black'으로 되어 있는 것 확인

 

    - 버튼 클릭 시 'night'으로 변경되며, 밝은 모드 상태인 것 확인 가능

 

    - 버튼 한 번 더 클릭 시 'day'로 변경되며, 어두운 모드로 변경되는 것 확인 가능