Event Listener

이벤트 발생 시 어떤 액션을 위한 함수 호출

addEventListener()

이벤트 발생 시 이벤트 리스너 호출을 위한 해당 객체나 요소에 등록해주는 함수

element.addEventListener(이벤트명, 실행 함수명(listener), 옵션);

element : 이벤트 발생에 의한 함수 호출할 요소

click : 클릭 이벤트명

() => {alert(...)}; : 실행 함수

---

Event 객체

이벤트 발생 시 이벤트 자체의 객체를 가져올 수 있음

실행 함수 내에서 매개변수로 event를 넣어줘야함

.target : 이벤트 객체 대상 -> buttonElement

.target.id : 이벤트 대상의 id

.target.className : 이벤트 대상의 클래스이름

.target.classList : 이벤트 대상의 클래스 리스트

.type : 이벤트 유형

.clientX : 이벤트 대상과 윈도우로부터의 거리 X 좌표

.clientY : 이벤트 대상과 윈도우로부터의 거리 Y 좌표

.offsetX : 이벤트 대상과 요소로부터의 거리 X 좌표

.offsetY : 이벤트 대상과 요소로부터의 거리 Y 좌표