이벤트 버블링
기포가 밑에서 부터 위에서 가듯, 이벤트가 발생한 요소부터 최상단 요소 (보통 document객체 몇몇은 window객체 까지도) 까지 전달되는 동작을 말합니다.
거의 모든 이벤트가 버블링 되며, focus() 등 몇몇 이벤트는 버블링 되지 않습니다.
이벤트 버블링시, event.currentTarget(this) 는 핸들러가 발생한곳( 즉 이벤트를 넣은태그)이 감지됨.
event.target은 실제 클릭한 태그가 감지됨.
event.stopPropagation으로 버블링 중단가능하다
이를 어떤 태그에 적으면 그 태그 부모들은 더이상 이벤트를 전달 받지 못한다. 허나, onclick에 이 핸들러를 적으면 onclick에 대해서만 중단하고 그 외 keypress 등 다른 핸들러가 겹쳐있을 경우엔 이는 중단되지 않는다. 그럴 때 stopImmediatePropagation()을 사용하면 할당 된 모든 이벤트 핸들러가 적용되지 않습니다.
'개발 > Web Front-End' 카테고리의 다른 글
[클린코드 자바스크립트] 배열 및 객체 (0) | 2022.08.31 |
---|---|
Executive Context (0) | 2022.08.28 |
브라우저 렌더링 프로세스 - 1 (0) | 2022.08.07 |
mvc 도전기 (0) | 2022.08.04 |
[Web front-end] script 위치와 defer async (0) | 2022.07.24 |