HTML? DOM? 자바스크립트? 생활코딩을 통해 알아봅시다!

• 생활코딩 HTML 강의 - https://opentutorials.org/course/3 
• 생활코딩 자바스크립트 강의 - https://opentutorials.org/course/48 

DOM (Document Object Model) 는 웹페이지(HTML)를 통해 우리 눈에 보이는 여러 요소들을 의미합니다.

웹페이지에서 동작하는 대표적인 프로그래밍 언어인 자바스크립트를 이용하면 특정한 DOM의 모양을 바꿀 수 있습니다.

DOM에는 스타일(Style)이라는 특성이 있는데 이를 변경하면 우리 눈에 보이는 모습이 바뀌게 됩니다.

오른쪽 상단의 실행 버튼을 누르면 오른쪽 하단에 URL이 나타납니다.

이것을 클릭하여 접속하면 새 창이 뜨면서 실행 결과를 눈으로 확인할 수 있습니다..

그러면, 버튼을 눌렀을때 왼쪽에 위치한 span DOM의 style 특성을, 오른쪽에 위치한 span DOM의 style 특성과 동일하게 변하도록 자바스크립트 함수를 작성해보세요.

오른쪽에 있는 소스 코드에서 foo라는 함수를 수정하면 됩니다.