버블링

한 요소에 이벤트가 발생하면, 이 요소에 할당된 핸들러가 동작하고, 이어서 부모 요소의 핸들러가 동작합니다. 가장 최상단의 조상 요소를 만날 때까지 이 과정이 반복되면서 요소 각각에 할당된 핸들러가 동작합니다.

p태그부분을 클릭했을 때 버블링이 발생되면서 div태그와 form태그 모두 실행이 된다.

버블링 중단

event.stopPropagation()을 이용하면된다