Event - e.preventDefault() / e.stopPropagation()

Joy·2022년 12월 16일
0
  • 사전지식

    html에서의 이벤트 전달 방식
    어떠한 태그(ex) div, ul, li, a 등)를 클릭했을 경우 해당 태그만이 클릭 이벤트를 감지하는 것이 아니라 태그를 감싸고 있는 부모 태그들도 클릭 이벤트를 인식하고 반응하게 된다.
    이것을 버블업(Bubble Up) 또는 버블링(Bubbling)이라고 한다.

e.stopPropagation()

상위요소로 해당 이벤트를 전달하지 않고 자신만 이벤트를 감지하도록 만든다.
즉, 부모 엘리먼트로의 이벤트 전달을 막아준다.

e.preventDefault()

html 웹 브라우저의 기본적인 동작들은 다양하다.
1. a 태그에서 href 속성을 이용한 사이트 이동
2. onSubmit을 했을때, 페이지가 새로고침 되는 고유의 브라우저 동작
즉, preventDefault()는 이러한 고유의 브라우저 동작을 막아준다..

profile
🐣

0개의 댓글