.stopPropagation()

박스링크 안에 좋아요 버튼이 있었다.

좋아요버튼을 누르면 링크를 타고 같이 이동하게 되는 문제가 있었다.

 

이벤트 방지를 하려고 해서 프리벤트 디폴트만 걸어서 했지만 슬라이드 이슈가 발생하였고
상위까지 전파되는 걸 막아야했고 stopPropagation()까지 걸어주니 해결이 되었다. 

 

event.stopPropagation()은 이벤트 전파를 막는 함수로써

자바스크립트 이벤트 시스템에서는 이벤트가 발생할 때

해당 요소 및 상위 요소들에 대해서도 이벤트가 전파되는데,

이걸 이벤트 버블링 이렇게 이벤트가 상위 요소로 전파되는 것을 브라우저가 기본적으로 처리하는데

event.stopPropagation()을 호출하면, 현재 이벤트 핸들러를 실행한 요소에서 이벤트 처리가 중지되고,

상위 요소들로 이벤트가 전달되지 않게 됨!