event.stopPropagation(), event.preventDefault() 관련 정리

javascript에서 event관련 작업을 진행 할때 원치 않는 추가 이벤트가 생기지 않게 해주는 메소드 입니다.

 

stopPropagation 은 a태그에 onclick이벤트가 발생될때 만약 해당 a태그가 ul > li > a 순으로 되어 있다면

위치상 li, ul에도 동일한 onclick이벤트가 발생되게 되는데 event.stopPropagation() 를 통해서 부모 태그로 연려되는 

이벤트를 막 을수 있습니다.

 

preventDefault 은 a태그에 onclick='' href='#' 으로 이벤트를 구성하는 경우 href='#'으로 인해서 스크롤 페이지에서 

상단 페이지로 자동 스크롤 되는 현상이 생기게 되는데(지금은 이런식의 코딩은 안하겠지만 예시로 작성 합니다.)

이때 preventDefault 을 호출하면 onclick이외의 다른 이벤트를 중지하게 됩니다.

(파일업로드 drag and drop 하다 오랜만에 해당 메소드를 보게 되서 지금이라도 정리 합니다.)