이벤트 버블링은 html에서 자식태그에 일어난 이벤트가 그 부모태그에도 일어나는 것이 반복돼서 최상위요소까지 이벤트가 전달되는 것을 말합니다. 이벤트가 부모 태그를 따라 올라가는 것이 물속에서 방울이 올라가는 것 같아서 이벤트버블링이라 합니다.
이벤트가 상위 태그로 전달되는 것을 방지하려면 이벤트의 stopPropagation 메소드를 써서 메소드를 사용한 요소에서 이벤트가 부모 태그로 올라가지 못하게 합니다.
다만 이벤트 버블링은 이벤트 핸들러를 적용해야 하는 자식요소가 여럿 있을 때 유용하게 쓰일 수 있기 때문에 stopPropagation은 필요한 상황에만 쓰는 것이 좋습니다. 공통부모를 가지고 있는 자식태그 전부에 이벤트 핸들러를 적용해야 할 때는 이벤트 버블링을 이용해서 이벤트핸들러를 부모요소에만 적용하면 그 아래있는 자식요소들에서 일어나는 이벤트를 한번에 감지하기 때문에 코드를 간결하게 할 수 있습니다. 이것을 이벤트 위임이라 합니다.
단 이때는 부모태그 자체에도 이벤트핸들링이 일어나니까 부모태그는 제외시키도록 조건문을 활용해서 적당한 코드를 작성해야합니다.
