---

title: Event의 역사와 정의

Event의 역사와 정의

Event의 역사

• DOM Event API는 DOM Level 2에서 논리적으로 표준화하려는 시도했음
• DOM Level 2의 개정 전, IE와 Netscape가 서로 정반대 이벤트 흐름을 채택함
• IE는 이벤트 버블링, Netscape는 이벤트 캡쳐링을 지원함
• 현재는 두 이벤트 흐름을 모두 지원함

Event의 정의

• javascript와 HTML 간의 상호작용을 담당
• 옵져버 패턴으로 이벤트가 발생할 때만 리스너가 실행

이벤트 버블링

• 이벤트 흐름상 문서 트리에서 가장 깊이 위치한 요소에서 시작해 거슬러 올라감
• 가장 깊이 위치한 요소에서 시작해 거슬러 흐르는 모양이 마치 거품이 올라가는 것 같아 버블링이라함

이벤트 캡처링

• 최상위 노드에서 처음으로 이벤트가 발생하며 가장 명시적인 노드에서 마지막으로 발생
• 이벤트 캡처링은 이벤트가 의도한 요소에 도달하기 전에 잡아채려는 목적으로 디자인

API

addEventListener(
  [이벤트 이름],
  [핸들러],
  [호출 시점 true: 캡쳐링, false: 버블링]
)

const onLoad = () => {};
window.addEventListener(
  'load',
  onLoad ,
  false
)