속성 event.target
속성 event.target은 이벤트가 발생한 요소를 포함합니다.
이는 이벤트 핸들러가 바인딩된 요소가 아니라, 예를 들어
직접 클릭이 발생한 가장 깊은 태그입니다.
문법
event.target;
예시
div가 있고 그 안에 단락이 있다고 가정해 봅시다.
div에 이벤트를 바인딩하지만 단락을 클릭하면
이 경우 event.target은 이벤트가 발생한 최종 태그,
즉 div가 아닌 단락을 포함합니다.
tagName을 사용하여 이를 확인해 봅시다:
<div id="div">
<p>text</p>
</div>
let div = document.querySelector('#div');
div.addEventListener('click', function(event) {
console.log(event.target); // 단락에 대한 참조를 출력합니다
});
참고 항목
-
이벤트가 바인딩된 요소를 포함하는 속성
event.currentTarget,
-
누른 키의 코드를 얻는 속성
code,
-
입력된 문자를 얻는 속성
event.key,