JavaScript - 이벤트 객체(Event Object)란?

이벤트 객체란?

이벤트를 발생시킨 요소와 발생한 이벤트에 대한 정보를 제공하는 것

이벤트 객체는 사용자가 직접 만들지 않아도 기본적으로 제공되며 이벤트 핸들러가 호출될 때 인수로 전달된다.

기본형식

• 매개변수(event)가 '이벤트 객체'를 의미 ('event'나 'e'로 많이 사용)

const showBtn = document.getElementById("btn");

showBtn.addEventListener("click", function (event) {
    event.속성
});

주요 속성

1> target : 이벤트를 발생시킨 객체를 반환
2> type : 이벤트의 이름을 반환
3> clientX(Y) : 이벤트가 발생한 X(Y)좌표값을 반환(브라우저 기준)
4> screenX(Y) : 이벤트가 발생한 X(Y)좌표값을 반환(스크린 기준)
5> button : 마우스 왼쪽, 가운데, 오른쪽 버튼값을 반환
6> altKey : alt 키가 눌러졌을 때 true 값을 반환
7> ctrlKey : ctrl 키가 눌러졌을 때 true 값을 반환
8> shiftKey : shift 키가 true 값을 반환