본문 바로가기
Frontend/JavaScript

[JavaScript] 클릭한 태그 찾기

by 모너아링 2023. 2. 23.

Introduction

다음과 같이 onClick 시 실행될 함수가 모두 같은 태그들이 있을 때, 어떤 태그가 클릭해서 함수가 실행됐는지 어떻게 알 수 있을지 알아보려고 한다.

 

● event.currentTarget 사용

방법은 간단한데, getInfo 함수 내에서 event.currentTarget를 콘솔에 찍어보면

다음과 같이 클릭한 태그의 속성들이 뜬다.

여기서 span 태그 안의 div 태그의 innerText에 접근하고 싶다면

event.currentTarget.children[1].innerText

childer의 배열을 사용한다.

결론적으로, 클릭한 태그에 대한 속성을 알고 싶으면 event.currentTarget을 사용하고

자식 태그를 활용하고 싶다면 childeren을 이용한다.