window, document, element 등의 EventTarget에 특정 이벤트가 발생할 때 사용하는 EventTarget 메서드 중 하나입니다.
EventTarget 메서드에는 addEventListener()
removeEventListener()
등이 있습니다.
addEventListener ( )
선택한 오브젝트에 이벤트를 추가합니다.
참고자료
기본 구문 Syntax
1. 기본 형태는 다음과 같습니다. EventTarget는에 window, document 또는 돔 element 등 다양한 오브젝트를 선택할 수 있으며 있습니다. 그리고 EventTarget 자리에는 이벤트의 타겟, 즉 발생할 이벤트의 대상이 될 오브젝트가 들어갑니다. 파라미터에는 이벤트의 종류와 실행할 함수가 들어갑니다.
EventTarget.addEventListener( 파라미터 );
2. 정리하면, 선택한 오브젝트에 선택한 이벤트유형이 발생하면 내가 만든 함수를 실행합니다.
선택한오브젝트.addEventListener(이벤트유형, 내가만든함수);
예를 들어, window 창에 전체 페이지와 그 안에 속한 모든 요소들이 로딩되면 myFunction이라는 함수를 실행합니다.
window.addEventListener("load", myFunction);
Event type
1. 이벤트 종류
참고자료
2. 자주 사용하는 마우스 이벤트
click : 마우스 버튼을 클릭하면 함수를 실행합니다.
mouseover : 마우스를 선택한 요소 위에 올렸을 때 함수를 실행합니다.
Event property
Event.currentTarget