JavaScript 이벤트 거품 및 이벤트 의뢰
IE 의 사건 흐름 을 사건 거품 이 라 고 합 니 다.말 그대로 사건 이 발생 한 후에 사건 은 안에서 밖으로 전파 되 기 시 작 했 고 아래 코드 를 살 펴 보 았 다.
Document
如果点击页面中的
元素，那么这个 chick 事件就会按照如下顺序传播：
세 개 를 누 르 면 전통 적 인 방식 으로 이 벤트 를 따로 추가 합 니 다.
클릭 이벤트 가 많 지 않 은 상황 에서 괜 찮 습 니 다. 모든 요소 가 이런 방식 을 사용 하면 사건 처 리 를 추가 하 는 데 사용 되 는 셀 수 없 이 많은 코드 가 있 습 니 다.마치 만 명 이 모두 회사 앞 에 몰 려 가 택 배 를 가 지 러 가 는 것 과 같다. 그 장면 은 정말 장관이다!하지만 택 배 를 프론트 데스크 에 놓 고 프론트 데스크 에서 받 은 다음 에 차례로 나 누 어 보 내 면 훨씬 편안 해 집 니 다.
위 에 서 는 이벤트 의뢰 방식 을 사용 합 니 다. 하위 요 소 는 이벤트 효 과 를 가 집 니 다. 이벤트 의뢰 를 할 때 요소 의 하위 노드 를 옮 겨 다 닐 필요 가 없습니다. 부모 요소 에 이벤트 만 추가 하면 됩 니 다. 하위 요 소 를 클릭 하면 이벤트 거품 방식 으로 부모 요소 가 추 가 된 같은 이 벤트 를 활성화 합 니 다.많은 js 가 dom 에 대한 이벤트 작업 을 줄 이 고 더 적은 메모 리 를 차지 합 니 다. 이것 은 아마도 이벤트 의뢰 의 정수 일 것 입 니 다.
단 추 를 사용 하 는 모든 이벤트 (대부분의 마우스 와 키보드 이벤트) 는 이벤트 의뢰 에 적합 합 니 다.
click 事件 在 直系DOM 树的每一级节点都会发生（自下而上），直到 document 对象。
事件委托
又称事件代理。对“事件处理程序过多”问题的解决方案就是事件委托。事件委托利用了事件冒泡，只指定一个父类事件处理程序，就可以管理某一类型的所有子类元素事件。
-
-
-
세 개
document.getElementById('sayHi').onClick(function(){...})
클릭 이벤트 가 많 지 않 은 상황 에서 괜 찮 습 니 다. 모든 요소 가 이런 방식 을 사용 하면 사건 처 리 를 추가 하 는 데 사용 되 는 셀 수 없 이 많은 코드 가 있 습 니 다.마치 만 명 이 모두 회사 앞 에 몰 려 가 택 배 를 가 지 러 가 는 것 과 같다. 그 장면 은 정말 장관이다!하지만 택 배 를 프론트 데스크 에 놓 고 프론트 데스크 에서 받 은 다음 에 차례로 나 누 어 보 내 면 훨씬 편안 해 집 니 다.
document.getElementById('myList').onClick(function(ev){
var e = ev || window.event;
var target = e.target;
switch (target.id) {
case 'goSth':
...
break;
case 'doSth':
...
break;
...
}
})
위 에 서 는 이벤트 의뢰 방식 을 사용 합 니 다. 하위 요 소 는 이벤트 효 과 를 가 집 니 다. 이벤트 의뢰 를 할 때 요소 의 하위 노드 를 옮 겨 다 닐 필요 가 없습니다. 부모 요소 에 이벤트 만 추가 하면 됩 니 다. 하위 요 소 를 클릭 하면 이벤트 거품 방식 으로 부모 요소 가 추 가 된 같은 이 벤트 를 활성화 합 니 다.많은 js 가 dom 에 대한 이벤트 작업 을 줄 이 고 더 적은 메모 리 를 차지 합 니 다. 이것 은 아마도 이벤트 의뢰 의 정수 일 것 입 니 다.
단 추 를 사용 하 는 모든 이벤트 (대부분의 마우스 와 키보드 이벤트) 는 이벤트 의뢰 에 적합 합 니 다.
좋은 웹페이지 즐겨찾기
