728x90
반응형
CSS가 아닌 스크립트로 스타일 변경하는 방법을 한번 알아봅시다
<div>
<div id="blue">blue</div>
<div id="red">red</div>
</div>
이러한 HTML 코드가 있다고 가정해봅시다.
CSS는 적용되어 있지 않습니다. 그럼 아무것도 없는것처럼 빈 공간만 있겠죠?
이제 자바스크립트를 통해 스타일을 넣어봅시다
const styleBlue = document.getElementById('blue');
const styleRed = document.getElementById('red');
이렇게 요소를 가져옵니다
styleBlue.style.height = '50px';
styleBlue.style.backgroundColor = 'blue';
styleRed.style.height = '50px';
styleRed.style.backgroundColor = 'red';
이렇게 적어주면 스타일이 변경된걸 확인할 수 있습니다!!
728x90
반응형