JavaScript의 style을 통한 스타일 초기화
특정 이벤트에 따라 요소를 숨기기로 결정했다고 가정해 봅시다:
elem.style.display = 'none';
이제 다시 표시하기로 결정했다고
가정해 봅시다. 이는 display 속성에
원래 값을 되돌려야 한다는 것을 의미합니다.
예를 들어, 다음과 같이 합니다:
elem.style.display = 'block';
문제는 이것이 편리하지 않다는 점입니다.
왜냐하면 원래 값이 반드시
block이었을 필요는 없기 때문입니다.
flex일 수도 있고, inline-block일 수도 있으며,
다른 무엇이든 될 수 있습니다. 우리가 CSS 파일에서
설정했을 수도 있고, 브라우저가 기본값으로
가져온 값일 수도 있습니다. 올바른 값을
추적하는 것은 복잡합니다.
다행히도, 속성의 원래 값을 쉽게 되돌리는 방법이 있습니다. 속성 값으로 빈 문자열을 할당하기만 하면 됩니다:
elem.style.display = '';
div와 두 개의 버튼이 주어져 있습니다. 첫 번째 버튼을 클릭하면 div를 숨기고, 두 번째 버튼을 클릭하면 다시 표시하세요.
div와 두 개의 버튼이 주어져 있습니다. 첫 번째 버튼을 클릭하면 div의 색상을 빨간색으로 변경하고, 두 번째 버튼을 클릭하면 원래 색상으로 되돌리세요.
