Javascript의 addEventListener()와 attachmentEvent()_javascript 스킬의 차이점 분석
- WBOY원래의
- 2016-05-16 18:52:321452검색
Mozilla:
addEventListener 사용 방법:
target.addEventListener(type, Listener, useCapture)
target: document node, document, 창 또는 XMLHttpRequest.
유형: 문자열, 이벤트 이름, "on" 제외(예: "click", "mouseover", "keydown" 등)
리스너: EventListener 인터페이스 또는 JavaScript의 함수를 구현합니다.
useCapture: 캡처 사용 여부, 일반적으로 false입니다. 예: document.getElementById("testText").addEventListener("keydown", function (event) { Alert(event.keyCode); }, false)
IE:
target.attachEvent(유형, 리스너)
대상: 문서 노드, 문서, 창 또는 XMLHttpRequest.
유형: "onclick", "onmouseover", "onkeydown" 등과 같은 "on"을 포함한 문자열, 이벤트 이름
리스너: EventListener 인터페이스 또는 JavaScript의 함수를 구현합니다. 예: document.getElementById("txt").attachEvent("onclick",function(event){alert(event.keyCode);});
W3C와 IE는 모두 지정된 이벤트 제거를 지원합니다. 설정을 제거하는 이벤트입니다.
W3C 형식:
removeEventListener(event, function, Capture/bubble)
Windows IE의 형식은 다음과 같습니다.
detachEvent(event, function);
target.addEventListener(type, Listener, useCapture)
대상 문서 노드, 문서, 창 또는 XMLHttpRequest.
"click", "mouseover", "keydown" 등과 같은 "on"을 제외하고 문자열, 이벤트 이름을 입력합니다.
리스너는 EventListener 인터페이스 또는 JavaScript의 함수를 구현합니다.
useCapture 캡처를 사용할지 여부는 나중에 이벤트 흐름 섹션을 읽은 후에 이해하게 됩니다. 일반적으로 false를 사용하십시오.
이벤트가 트리거되면 다음과 같은 이벤트 객체가 이벤트 핸들러로 전달됩니다.
document.getElementById ("testText").addEventListener("keydown", function (event) { Alert(event.keyCode); }, false)
적용되는 브라우저 버전이 다르므로 사용 시 주의하시기 바랍니다
attachmentEvent 메소드 버튼 onclick
addEventListener 메소드 버튼 클릭은 IE에서 사용됩니다.
fox에서 사용합니다. 둘 다 사용하는 원리: 실행 우선순위가 다를 수 있습니다. 다음 예는 다음과 같습니다.
attachEvent 메소드, for. 특정 이벤트 다른 처리 이벤트를 첨부합니다. (Mozilla 시리즈는 지원하지 않습니다.)
Mozilla 시리즈에서는 addEventListener 메소드를 사용합니다
예: document.getElementById("btn").onclick = method1
document.getElementById("btn").onclick = method2;
document.getElementById("btn").onclick = method3; 이렇게 작성하면 medhot3만 실행됩니다.
다음과 같이 작성합니다.
var btn1Obj = document.getElementById("btn1") ; //객체 .attachEvent(event,function);
btn1Obj.attachEvent("onclick",method1);
btn1Obj.attachEvent("onclick",method2); ,method3); 실행 순서는 method3->method2->method1
Mozilla 시리즈인 경우 이 메서드는 지원되지 않으며 addEventListener를 사용해야 합니다. var btn1Obj = document.getElementById("btn1") ;
//element.addEventListener(type,listener,useCapture);
btn1Obj.addEventListener("click",method1,false)
btn1Obj.addEventListener("click",method2,false); 🎜>btn1Obj.addEventListener("click" , method3, false); 실행 순서는 method1->method2->method3
예: (div는 js 앞에 위치해야 한다는 점에 유의하세요)
>
addEventListener 사용 방법:
target.addEventListener(type, Listener, useCapture)
target: document node, document, 창 또는 XMLHttpRequest.
유형: 문자열, 이벤트 이름, "on" 제외(예: "click", "mouseover", "keydown" 등)
리스너: EventListener 인터페이스 또는 JavaScript의 함수를 구현합니다.
useCapture: 캡처 사용 여부, 일반적으로 false입니다. 예: document.getElementById("testText").addEventListener("keydown", function (event) { Alert(event.keyCode); }, false)
IE:
target.attachEvent(유형, 리스너)
대상: 문서 노드, 문서, 창 또는 XMLHttpRequest.
유형: "onclick", "onmouseover", "onkeydown" 등과 같은 "on"을 포함한 문자열, 이벤트 이름
리스너: EventListener 인터페이스 또는 JavaScript의 함수를 구현합니다. 예: document.getElementById("txt").attachEvent("onclick",function(event){alert(event.keyCode);});
W3C와 IE는 모두 지정된 이벤트 제거를 지원합니다. 설정을 제거하는 이벤트입니다.
W3C 형식:
removeEventListener(event, function, Capture/bubble)
Windows IE의 형식은 다음과 같습니다.
detachEvent(event, function);
target.addEventListener(type, Listener, useCapture)
대상 문서 노드, 문서, 창 또는 XMLHttpRequest.
"click", "mouseover", "keydown" 등과 같은 "on"을 제외하고 문자열, 이벤트 이름을 입력합니다.
리스너는 EventListener 인터페이스 또는 JavaScript의 함수를 구현합니다.
useCapture 캡처를 사용할지 여부는 나중에 이벤트 흐름 섹션을 읽은 후에 이해하게 됩니다. 일반적으로 false를 사용하십시오.
이벤트가 트리거되면 다음과 같은 이벤트 객체가 이벤트 핸들러로 전달됩니다.
document.getElementById ("testText").addEventListener("keydown", function (event) { Alert(event.keyCode); }, false)
적용되는 브라우저 버전이 다르므로 사용 시 주의하시기 바랍니다
attachmentEvent 메소드 버튼 onclick
addEventListener 메소드 버튼 클릭은 IE에서 사용됩니다.
fox에서 사용합니다. 둘 다 사용하는 원리: 실행 우선순위가 다를 수 있습니다. 다음 예는 다음과 같습니다.
attachEvent 메소드, for. 특정 이벤트 다른 처리 이벤트를 첨부합니다. (Mozilla 시리즈는 지원하지 않습니다.)
Mozilla 시리즈에서는 addEventListener 메소드를 사용합니다
예: document.getElementById("btn").onclick = method1
document.getElementById("btn").onclick = method2;
document.getElementById("btn").onclick = method3; 이렇게 작성하면 medhot3만 실행됩니다.
다음과 같이 작성합니다.
var btn1Obj = document.getElementById("btn1") ; //객체 .attachEvent(event,function);
btn1Obj.attachEvent("onclick",method1);
btn1Obj.attachEvent("onclick",method2); ,method3); 실행 순서는 method3->method2->method1
Mozilla 시리즈인 경우 이 메서드는 지원되지 않으며 addEventListener를 사용해야 합니다. var btn1Obj = document.getElementById("btn1") ;
//element.addEventListener(type,listener,useCapture);
btn1Obj.addEventListener("click",method1,false)
btn1Obj.addEventListener("click",method2,false); 🎜>btn1Obj.addEventListener("click" , method3, false); 실행 순서는 method1->method2->method3
예: (div는 js 앞에 위치해야 한다는 점에 유의하세요)
코드 복사 코드는 다음과 같습니다.
; 클릭
>