[JavaScript] 이벤트 버블링(Event Bubbling), 이벤트 캡처링(Event Capturing)

[JavaScript] 이벤트(Event)란? 에서 이벤트(Event)와 이벤트 핸들러(Event Handler)에 대해 알아봤었습니다. 요약하자면 다음과 같습니다. 이벤트를 감지하는 이벤트 핸들러를 HTML과 연동 1번에서 연동된 HTML 부분에 사용자가 어떤 행동을 하면 (예: 클릭) 이벤트가 발생 이벤트 핸들러에 등록된 코드 실행 음.. 근데 만약 HTML 요소들이 중첩되어있다면 이벤트 핸들러는 어떻게 동작할까요? 예를 들어 이 코드에서 depth3 영역을 클릭한다면, 어떤 alert가 뜰까요? 한번 직접 눌러볼까요? HTML 삽입 미리보기할 수 없는 소스 분명 하나의 영역만 클릭했는데, 모든 onClick 이벤트 핸들러가 동작한 것을 확인하셨나요? 위와 같이 중첩된 요소에서 이벤트가 발생할 때는,..