자바스크립트 이벤트 학습 6장 이벤트 접근_자바스크립트 기술

이제 이벤트 핸들러를 등록했으므로 이벤트에 대해 자세히 알아보고 싶습니다. 우리는 이벤트가 발생했을 때 마우스 위치를 알고 싶고, 사용자가 어떤 키를 눌렀는지 알고 싶습니다. 이 부분에는 성가신 브라우저 호환성 문제가 많이 있지만 이것들은 모두 가능합니다. (여기에서 브라우저 호환성 목록을 빠르게 확인할 수 있습니다).
이벤트 속성을 읽으려면 먼저 이벤트에 액세스할 수 있어야 합니다.
브라우저 호환성
브라우저 전쟁의 관점에서 볼 때 Netscape는 액세스 모델(나중에 W3C에서 참조로 사용됨)과 많은 이벤트 속성을 구현했으며 Microsoft도 동일한 작업을 수행했습니다. 물론 두 모델은 완전히 호환되지 않습니다. 하지만 서문에서 말했듯이

코드를 복사하면 코드는 다음과 같습니다.

if (W3C/Netscape) {
액세스 및 속성 이름에 W3C/Netscape 모델 사용
}
else if (Explorer) {
액세스 및 속성 이름에 Microsoft 모델 사용
}

이것은 호환성 문제를 해결하는 잘못된 방법입니다. 이는 대부분의 코드를 실행할 수 있지만 이를 고려하지 않은 일부 브라우저를 쓸모없게 만듭니다. 따라서 먼저 이벤트에 액세스한 다음 해당 속성을 별도로 읽어야 합니다.
이벤트 접근 문제를 먼저 논의하고, 이벤트 속성에 대해서는 나중에 논의하겠습니다.
W3C/Netscape
W3C/Netscape 이벤트 액세스 모델에서는 이벤트가 매개변수로 이벤트 핸들러에 전달됩니다. 따라서 이벤트 핸들러
element.onclick=doSomething;

doSomething()을 정의하면 이벤트를 매개변수로 사용합니다. e 변수에 저장하는 것이 일반적입니다. 물론 임의의 이름으로 변경할 수 있습니다.

코드 복사 코드

function doSomething(e) {
// e는 이벤트에 대한 액세스를 제공합니다
}

이것은 완전히 자동이며 추가 작업이 없습니다. 코드가 필요합니다. 익명 함수에서는 다음과 같이 작성할 수 있습니다:
element.onclick = function (e) {alert('Event type is ' e.type)}

Microsoft
Microsoft의 이벤트 액세스 모델에는 발생한 마지막 이벤트를 포함하는 특수 속성 window.event입니다.

코드 복사 코드는 다음과 같습니다.

element.onclick = doSomething;
function doSomething() {
// window.event는 이벤트에 대한 액세스를 제공합니다
}

또는

코드 복사 코드는 다음과 같습니다:

element.onclick = function () {alert('이벤트 유형은 ' window.event.type)}

이벤트 및 이벤트
오래된 Netscape 속성 window.Event도 있음을 확인하세요. IE는 이것을 이해하지 못하며 Netscape 4는 이를 잘못 해석할 것입니다. 따라서 글을 작성할 때 이벤트가 소문자 e로 시작하는지 확인하세요.
크로스 브라우저 이벤트 액세스
다행히 크로스 브라우저 액세스 이벤트에 대한 스크립트를 작성하는 것은 매우 간단합니다.

코드 복사 코드는 다음과 같습니다.

element.onclick = doSomething;

function doSomething(e) {
if (!e) var e = window.event ;
// e는 모든 브라우저에서 이벤트에 대한 액세스를 제공합니다
}

e가 없으면 window.event에 할당합니다. e는 이제 모든 브라우저에서 이벤트를 나타냅니다.
인라인 이벤트 핸들러와 병합
인라인 등록 모델에서는 이벤트를 함수에 전달해야 합니다.

코드 복사 코드는 다음과 같습니다.

 

function doSomething(e) { 
alert( e.type ); 
} 

 

Microsoft 모델에서는 (window.) 이벤트가 올바른 속성이지만 다른 브라우저에서도 이를 인식할 수 있습니다.
계속
계속 학습하고 싶다면 다음 장을 읽어주세요.
원본 주소: http://www.quirksmode.org/js/events_access.html
첫번째 번역은 제 트위터 @rehawk를 포함해 주세요.