• addeventListener에는 다음과 같이 3 개의 매개 변수가 있습니다.
element.addeventListener (유형, 리스너, usecapture);
| 매개 변수 | 매개 변수 설명 |
|---|---|
| 요소 | 이벤트와 HTML 노드를 바인딩하는 객체. |
| 유형 | 이벤트 이름은 이벤트 전에 "on"을 제거하십시오. 예를 들어, "OnClick"은 "클릭"으로 작성해야하며 "OnMouseOver"는 "MouseOver"로 작성되어야합니다. |
| 경청자 | 이벤트 청취 함수를 바인딩하려면 기능 이름 만 작성하고 브래킷을 포함하지 않도록주의하십시오. |
| uscapture | 이벤트 모니터링 방법은 true and false 일 수 있습니다 : true, 캡처 모드 채택; 거품, 거품 모드 채택. 특별한 요구 사항이 없으면 일반적으로 거짓입니다. |
여기서 캡처 모드와 버블 모드의 차이에 대해 이야기해야합니다.
그림에서 볼 수 있듯이 DIV 요소의 두 층이 있으며 둘 다 클릭 이벤트가 설정되어 있습니다. 일반적으로 내부 파란색 요소를 클릭하면 파란색 요소의 클릭 이벤트를 트리거 할뿐만 아니라 빨간색 요소의 클릭 이벤트를 동시에 트리거합니다. Usecapture 매개 변수는 현재 두 번의 클릭 이벤트의 순서를 제어하는 것입니다. 거짓 인 경우 버블 모드가 사용됩니다. 내부에서 프로세스이므로 파란색 요소의 클릭 이벤트가 먼저 실행 된 다음 빨간색 요소의 클릭 이벤트가 실행됩니다. 사실이라면 캡처 모드입니다. 버블 모드와 달리 외부에서 내부로입니다. 빨간색 요소의 클릭 이벤트는 파란색 요소의 클릭 이벤트가 실행되기 전에 먼저 실행됩니다.
다른 층의 요소에서 사용하는 usecapture가 다른 경우, 대상 요소는 먼저 가장 바깥 요소에서 모드로 설정된 이벤트를 찾습니다. 대상 요소에 도달하여 대상 요소의 이벤트를 실행 한 다음 버블 모드로 설정된 이벤트를 찾으십시오.
• 첨부 장치에는 다음과 같이 2 개의 매개 변수가 있습니다.
요소 .attachevent (유형, 리스너);
| 매개 변수 | 매개 변수 설명 |
|---|---|
| 요소 | 이벤트와 HTML 노드를 바인딩하는 객체. |
| 유형 | 이벤트 이름은 addeventListener와의 차이점 인 "Onclick"및 "OnMouseOver"와 같은 이벤트 전에 "on"을 추가하십시오. |
| 경청자 | 이벤트 청취 함수를 바인딩하려면 기능 이름 만 작성하고 브래킷을 포함하지 않도록주의하십시오. |
addeventListener ()는 W3C에서 지원하는 이벤트 청취 함수를 바인딩하는 표준 메소드입니다. Chrome, Firefox, Opera, Safari, IE9.0 및 무엇 보다도이 기능을 지원합니다. 그러나 IE8.0 이하는이 방법을 지원하지 않으며 첨부 이벤트 ()를 사용하여 이벤트 청취 기능을 바인딩합니다. 따라서이 바인딩 이벤트 방법은 브라우저 호환성 문제를 처리해야합니다.
IE 및 Nonie 브라우저 이벤트 바인딩과 호환되는 코드 :
function addevent (obj, type, hands) {try {// chrome, firefox, opera, safari, ie9.0 이상의 버전 obj.adeventListener (유형, 핸들, 거짓); } catch (e) {try {// ie8.0 이상 버전 obj.attachevent ( 'on' + type, handle); } catch (e) {// 초기 브라우저 obj [ 'on' + type] = 핸들; }}}또는
함수 Regevent (ele, event_name, fun) {if (window.attachevent) ele.attachevent (event_name, fun); // 즉, 브라우저 else {event_name = event_name.replace (/^on/, ""); // 시작시, onclick->와 같이 삭제 된 경우 ele.AddeventListener (Event_Name, fun, false); // IE 브라우저}}위의 기사는 AddeventListener와 AttachEvent의 차이점에 대해 간단히 이야기합니다. 나는 당신이 당신에게 참조를 줄 수 있기를 바랍니다. 그리고 당신이 wulin.com을 더 지원할 수 있기를 바랍니다.