[TIL] 이벤트 버블링?

 

 

 이벤트 버블링이란 물 속에서 거품이 보글보글 올라오는 것에서 연상된 표현으로 하위에 요소에서 진행되는 이벤트가 상위의 요소들에게 전달되는 것을 말한다. 예를들어 button요소를 감싸고 있는 button요소를 클릭하면 button 요소에 있는 onClick이벤트가 실행되고 감싸고 있는 div에 있는 onClick이벤트가 실행된다. 만약 div위에 상위 요소가 있다면 그 요소도 마찬가지로 onClick이벤트가 실행된다. 

 이를 방지하기 위해서는 event.stopPropagation()이라는 웹API를 사용하면된다. 이를 사용할 경우 target하는 해당 요소에서만 이벤트가 발생하게 된다.