이벤트 귀속, 이벤트 거품 및 포획

1515 단어
1. 이벤트 귀속 이벤트 귀속은 이벤트 의뢰라고도 부른다. 이벤트 에이전트는 같은div에 여러 이벤트를 귀속시킬 수 있다.
비IE:
    element.addEventListener("click",fn,false)     
    element.removeEventLisenter("click",fn,false)     

IE:
    element.attachEvent("onclick",fn)     
    element.detachEvent("onclick",fn)     

바인딩 이벤트 호환 쓰기: (같은 이치 제거)
function addEvent(element,type,fn){
     if(element.addEventListener){
            element.addEventListener(type,fn,false)
     }else if(element.attachEvent){
            element.attachEvent("on"+type,fn);
     }else{
            target["on"+type]=fn;
     }
}

2. js 사건 포획과 거품
1. 이벤트 거품은 무엇입니까? 이벤트는 가장 특정한 이벤트 목표에서 가장 불특정한 이벤트 목표(document 대상)까지의 순서에 따라 촉발됩니다.(기본 이벤트 프로세서, 하위 레벨에서 상위 레벨까지)
2. 이벤트 포획이 무엇인지: 이벤트는 가장 부정확한 대상(document 대상)부터 촉발한 다음에 가장 정확한(창 단계에서 이벤트를 포획할 수도 있지만 개발자가 특별히 지정해야 한다).(캡처 이벤트가 먼저 발생, 부모에서 하위 단계까지)
3. 이벤트 귀속 중의false,true(1)작용: 세 번째 파라미터useCapture는 Boolean 값으로 이벤트가 포획될 때 실행되는지 이벤트가 거품이 생겼을 때 실행되는지 설정합니다(2)true: 이벤트 포획, 부모 요소가 먼저 터치하고 아랫 요소가 먼저 터치하며 아랫 요소가 먼저 터치한다. 즉div가 먼저 터치하고 p 후에 터치한다(3)false: 이벤트가 거품을 일으키고 아랫 요소가 먼저 터치하고 아랫 요소가 먼저 터치한다. 즉, p가 먼저 터치하고 div가 나중에 터치한다.
4. 거품 막기:ev.cancelBubble=true; ev.stopPropagation();
5. 거품 방지 호환 쓰기:
function stopBubble(e){
        if(e&&ev.stopPropagation){
              e.stopPropagation();
        }else{
            e.cancelBubble=true;
        }
}

좋은 웹페이지 즐겨찾기