event.stopPropagation()

· javascript
이벤트를 등록할때 내가 생각하지 못했던(?)대로 이벤트가 적용될때가 있습니다. 바로 이벤트 버블링과 캡처링 때문인데요. 어떻게 이벤트가 흐름을 타는지 알아봅시닷! 1️⃣ 이벤트 버블링(event bubbling) 이벤트가 발생했을때 하위요소(자식) -> 상위요소(부모)로 이벤트가 전달되는 현상 클릭 결과 위의 코드를 보면 div랑 button요소가 중첩되있어요. 보통 이렇게 요소가 중첩되어 동일한 이벤트가 발생할때 이벤트 버블링이 발생합니다. div가 부모고 button이 자식인 상태에서 두 요소에 이벤트를 할당해주었습니다. 그러면 어떤게 먼저 호출될까요? 바로 자식인 child의 이벤트가 호출됩니다. 이벤트 버블링 때문이죠! 버튼을 클릭하면 버튼이 하위요소이기 때문에 child가 먼저 호출되고 부모인 ..
이챙(leechaeng)
'event.stopPropagation()' 태그의 글 목록