이벤트 버블링 & 캡처링

바닐라 JS 로 프로그래밍을 하다보면 생기는 현상이 있다.이벤트를 다른 곳에 지정했는데 왜 상위요소가 지정되지?왜 하위요소도 전부..?event flow DOM 이벤트 흐름에는 캡처링, 타겟, 버블링 3가지가 있다. 캡처링은 이벤트가 하위요소로 전파되는 것이고타겟은 이벤트가 실제 타겟 요소에 전달되는 것그리고 버블링은 이벤트가 상위 요소로 전파되는 것이다. td 태그를 클릭하게 되면 이벤트가 최상위에서 시작해 아래로 전파. -> 캡처링이벤트가 타겟 요소에 도착해 실행 된다. -> 타겟그리고 다시 위로 전파된다. -> 버블링 위 그림의 3개의 phase 중에서 이벤트 핸들러가 실행되는 과정은 원래 target phase, bubbling phase 이나, 필요에 따라서 capture phase 와 targ..

2024.05.02