js dark

웹페이지 내 다크모드

최근 웹사이트에서 눈의 피로(?)를 줄이기 위한 다크 모드를 쉽게 볼수 있다. 이를 자바스크립트를 통해 구현해보자. 아이콘을 클릭함에 따라 배경화면과 글자색이 변경되도록 구현해야합니다. 이를 구현해주는 자바스크립트 기능을 알아보겠습니다. 1. Toggle 자바스크립트에서는 toggle 이라는 특수한 메서드를 제공합니다. 스위치를 켯다 껏다 반복하는 이미지로 이해하면 훨씬 와닿을겁니다. 직관적으로 보면 그냥 클릭 한번으로 쉽게 구현이 될 것 같지만, toggle을 이용하지 않는다면, 과정 자체는 조금 길어지게 됩니다. body{ background-color: #f3f3fe;; color: #000;; } body.dark-theme{ background-color: #000; /* 검정색 */ color..