[jQuery] stopPropagation() & preventDefault()

event.stopPropagation()

버블업을 막기 위한것으로 부모 태그로의 이벤트 전파를 막기위해서 사용한다.

<ul onclick="..">
  <li onclick="..">
    <a href="#" onclick="..">

예를들어 위와 같은 소스에서 a 태그의  클릭 이벤트를 실행할 경우, 웹에서는 a 태그의 클릭 이벤트뿐만 아니라 부모 ul, li 태그의 클릭 이벤트도 발생시킨다.
이때 부모의 클릭 이벤트를 제외한 a 태그의 클릭 이벤트만 발생시키고 싶을 경우 사용한다.


event.preventDefault()

a 태그의 href="#" 웹 페이지 스크롤 상단으로 이동하는 속성을 막기 위해 사용한다.
<a href="#" onclick=".."> 의 클릭 이벤트를 실행하면 클릭 이벤트 -> href 이벤트 순서로 이벤트가 발생한다.
href="#"의 #를 앵커라고 하는데, 이는 타 URL로 이동하는것을 막지만 웹 페이지를 스크롤을 상단으로 이동시킨다. 이 이벤트를 막고 싶을때 사용한다.