[JS]이벤트 버블링

이벤트 버블링

모든 부라우저는 이벤트 버블링이 발생한다.

이벤트가 상위 html로 퍼지는 현상임.

<div>
 <div>
   <h4>로그인하슈</h4>
 </div>
</div>

h4 클릭하면 상위 두개의 div도 클릭한 것처럼 작동하면서
결과적으로 3번 눌리게 됨.

이벤트 관련 함수

1. e.target : 유저가 실제로 누른 곳.
2. e.currentTraget : 이벤트리스너가 달린 요소
   = this; <- 얘도
3. e.preventDefault() : 이벤트 기본동작 막아줌
   ex) form의 submit시 리프레쉬 되는 것 막아줌
4. e.stopPropagation() : 상위 요소로 이벤트 버블링 막아줌.