[자바스크립트] 버블링을 이용해 이벤트 등록하기


[자바스크립트] 버블링을 이용해 이벤트 등록하기

우선 이벤트의 단계중 버블링의 개념에 대해 알아야한다. 이벤트의 마지막 단계인 버블링은 타게팅 이후 document로 돌아가는 과정인데 버블링을 활용해서 이벤트를 등록하는 방법을 알아본다. stopPropagation( ) - 버블링 중단 div안에 버튼 두개를 만들고 세 개의 노드에 클릭 시 콘솔을 띄워주고 bubbles값이 true가 나오는지 확인해 버블링이 발생하는지 알아보는 이벤트를 등록한다. 버블링 처리 버튼을 누르면 btn1과 panel에서 반응이 온다. 이는 btn1에서 클릭이벤트의 타게팅이 이뤄지고 다시 돌아가는 버블과정에서 panel을 지나치기 때문이다. 이번엔 버블링 중지 버튼을 눌렀고 #btn2에 등록된 이벤트내용중 stopPropagation메소드로 인해 버블링이 중단되어 panel..


원문링크 : [자바스크립트] 버블링을 이용해 이벤트 등록하기