
버블링 과 캡처링
Front-End/JavaScript
2023. 3. 31. 15:46
버블링 위의 이미지와 같이 버블링은 이벤트가 발생한 요소부터 위로 올라간다. FORM DIV P 만약 p태그를 클릭해도 form 태그에 할당된 핸들러가 동작되는 것을 말한다. 가장 안쪽의 p 태그를 클릭하면 p에 할당된 onclick 핸들러가 동작하고, 그 바깥의 div태그의 핸들러가 동작한다. 그리고 from에 할당된 핸들러가 동작한다. document 객체를 만날때까지, 각 요소에 할당된 onclick 핸들러가 동작한다. p를 클릭한다면 p, div, form 의 얼럿창이 순서대로 뜨게 되는 것이고 div 를 클릭한다면 div, form 순으로 얼럿창이 뜨게 되는 것이다. 이것은 event.target을 이용하여 접근할 수 있다. event.target 이벤트가 발생한 가장 안쪽의 요소는 타깃(tar..