🥕 event.target vs event.currentTarget
target은 이벤트가 처음 발생한 대상을 가리킨다.
반면에, currnetTarget은 이벤트가 버블링 또는 캡쳐링이 되는 과정에서 현재 이벤트가 위치하고 있는 대상을 가리킨다.
*target과 같은 요소를 참조할 수도 있고 다를 수도 있다.
<body>
<ul id="list">
<li id="1">item1</li>
<li id="2">item2/li>
<li id="3">item3</li>
</ul>
<script>
const list = document.querySelector('#list');
list.addEventListener('click', (e) => {
console.log(e.target); // <li id="1">item1</li>
console.log(e.currentTarget); // <ul id="list">...</ul>
});
</script>
</body>'Elice > Study' 카테고리의 다른 글
| [JavaScript / React] (1) | 2024.03.28 |
|---|---|
| [JavaScript] 버블링과 캡처링 (0) | 2024.03.21 |
| [JavaScript] Script 태그의 defer, async (0) | 2024.03.21 |
| [JavaScript] 재귀(Recursive)와 스택(Call Stack)+반복문과 성능 비교 (0) | 2024.03.21 |
| [JavaScript] DOM (0) | 2024.03.21 |
