(JS)Event Listener

- 이벤트 리스너

이벤트 리스너는 DOM 객체에서 이벤트가 발생할 경우 해당 이벤트 처리 핸들러를 추가할 수 있는 오브젝트이다.

이벤트 리스너를 이용하면 특정 DOM에 Javascirpt 이벤트가 발생할 때 특정 함수를 호출한다.

- JavaScirpt 이벤트란?

DOM에서 특정 이벤트가 발생되면 우리는 JavaScript 이벤트 객체에서 이를 확인할 수 있다.
DOM 구조에서 이벤트는 매우 다양하지만, 자주 쓰는 이벤트는 아래와 같다.

-포커스 이벤트(focus, blur)
-폼 이벤트(reset, submit)
-뷰 이벤트(scroll, resize)
-키보드 이벤트(keydown, keyup)
-마우스 이벤트(mouseenter, mouseover, click, dbclick, mouseleave)
-드래그 앤 드롭 이벤트 (dragstart, drag, dragleave, drop)

- 이벤트 리스너 등록하기

특정 DOM요소에 이벤트 리스너를 등록할 때는 addEventListener를 사용한다.

DOM객체. addEventListener(이벤트명, 실행할 함수명, 옵션)

각 매개변수를 살펴보면

-이벤트명 : Javascript에서 발생할 수 있는 이벤트 명을 입력한다.

-함수명 : 해당 변수는 생략 가능하며, 해당 이벤트가 발생할 때 실행할 함수 명을 입력한다.

-옵션: 옵션은 생략이 가능하며, 자식과 부모 요소에서 발생하는 버블링을 제어하기 위한 옵션이다.