[Javascript] 이벤트 버블링

버블링(bubbling)

1. 한 요소에 이벤트가 발생하면 이 요소에 할당된 핸들러가 동작하고, 이어서 부모 요소의 핸들러가 최상위 요소를 만날 때까지 반복되면서 핸들러가 동작하는 현상
2. <div class="DIV3">DIV3</div>
   를 클릭하면 할당되어 있는 이벤트가 발생하고 다음에는 바깥의 div 태그에 할당된 이벤트가 발생하고 document 객체를 만날 때까지 이벤트가 전파된다.

이벤트 버블링 막는 방법

• e.stopPropagation()
  - 이벤트가 상위 엘리먼트에 전달되지 않게 막아준다.
  - 이벤트 버블링을 막아줌
  
  
  
  

참고 사이트
https://joshua1988.github.io/web-development/javascript/event-propagation-delegation/#%EC%9D%B4%EB%B2%A4%ED%8A%B8-%EC%BA%A1%EC%B3%90---event-capture