캡처링

이벤트 버블링(Event Bubbling) 및 이벤트 캡처링(Event Capture)에 대해서

이벤트 버블링 이벤트 버블링은 한 요소에서 이벤트가 발생하였을 때, 해당 요소와 그 요소는 물론이고 그 요소의 모든 조상들에 연결된 이벤트가 모두 실행되는 것을 의미한다. 다음과 같은 예가 있다고 생각해보자. Hello 🫐 World 위의 HTML은 div 내부에 span이 들어있는 구조이다. #container { background: blue; color: white; } .emoji { background: red; } 구분하기 쉽게 div요소는 파랑, 내부의 span은 빨간색의 배경을 가지게 한다. const divContainer = document.querySelector('#container'); divContainer.addEventListener('click', () => { window..