If you're seeing this message, it means we're having trouble loading external resources on our website.

웹 필터가 올바르게 작동하지 않으면 도메인 *. kastatic.org*.kasandbox.org이 차단되어 있는지 확인하세요.

주요 내용

이벤트에 인터랙티브한 웹 페이지 만들기

동영상 대본

여러분은 웹페이지의 DOM에 접근해서 수정하는 법을 배웠어요 여러분은 그걸 몇 시간이고 할 수 있죠 그런데 여러분이 웹페이지의 시작을 단지 HTML로도 할 수 있는데 왜 그렇게 하는 걸까요? 왜냐하면 이젠 그 모든 걸 사용자 이벤트로 할 수 있어요 그게 웹페이지에서 JavaScript가 강력한 이유에요 예를 들어 여러분은 인터랙티브한 슬라이드쇼를 만들 수 있어요 사용자가 버튼을 클릭할 때 반응함으로써요 여러 종류의 게임을 만들 수도 있어요 사용자가 키를 누를때 반응하거나 마우스로 새를 겨냥하는 게임 등이요 여러 양식을 처리하고 사용자 입력값을 검증할 수도 있어요 사용자가 그 양식에 뭔가를 입력할 때 말이죠 무한정 로드되는 사진첩을 만들 수도 있어요 사용자가 페이지를 스크롤 할 때 반응해서요 이 모든 것은 웹페이지의 이벤트를 이용하면 가능해요 사용자가 버튼을 클릭하는 것 같은 어떤 행동을 할 때 브라우저는 그 버튼에 대한 클릭 이벤트를 작동시키고 여러분의 코드에는 그 이벤트에 대한 리스너 함수가 있어서 브라우저가 리스너 함수를 호출할 거에요 이 함수는 여러분이 원하는 동작을 담고 있는 JavaScript에요 이건 어떻게 작동하는 지에 대한 간단한 설명이에요 이제 웹페이지에서 실제로 어떻게 사용하는 지 보여줄거에요