JavaScript 고급 프로그래밍 제2판 12장 이벤트 요점 요약(일반적으로 사용되는 크로스 브라우저 감지 방법)_Javascript 기술

var EventUtil={ //크로스 브라우저 핸들러 -- - 메소드 생성
addHandler:function(element,type,handler){
if(element.addEventListener){
element.addEventListneter(type,handler,false)
}else if(element. attachmentEvent) {
element.attachEvent("on" type,handler);
}else{
element["on" type]=handler;
}
removeHandler: function( element,type,handler){ //크로스 브라우저 핸들러---제거 방법
if(element.removeEventListener){
element.removeEventListneter(type,handler,false)
}else if ( element.detachEvent){
element.detachEvent("on" type,handler)
}else{
element["on" type]=handler;
}
}
getEvent:function(event){ //크로스 브라우저 이벤트 객체---이벤트 객체에 대한 참조 반환
return event?event:window.event
}
getTarget:function(event); { // 크로스 브라우저 이벤트 객체---이벤트 대상을 반환합니다.
return event.target||event.srcElement
}
preventDefault:function(event){ //크로스 브라우저 이벤트; object---cancel 기본 이벤트
if(event.preventDefault){
event.preventDefault();
}else{
event.returnValue=false; 🎜>stoppropagation:function(event){ //크로스 브라우저 이벤트 객체---이벤트 흐름 차단
if(event.stoppropagation){
event.stoppropagation()
}else{
event.canceBubble=false ;
}
}
getRelatedTarget:function(event){ //여러 브라우저에서 관련 요소 가져오기
if(event.관련Target){
return event.관련Target; 🎜>}else if(event.toElement){
return envent.toElement;
}else if(event.fromElement){
return event.fromElement;
}else{
return null ;
}
}
getButton:function(event){ //마우스 이벤트의 버튼 속성 감지
if(document.implementation.hasFeature("MouseEvent","2.0")){
return event. 버튼
}else{
switch(event.button){
케이스 0:
케이스 1:
케이스 3:
케이스 5:
케이스 7:
0을 반환
사례 2:
사례 6:
2를 반환
사례 4:
1을 반환
}
}
}
getCharCode:함수(이벤트){ //크로스 브라우저 문자 인코딩---charCode 속성 감지
if(typeof event,charCode=="number"){
return event.charCode
}else; {
return event.keyCode;
}
}
}


이벤트 위임: 너무 많은 이벤트 핸들러에 대한 솔루션, 메모리 감소 및 성능 향상
이벤트 시뮬레이션: 이는 더 복잡하며 천천히 연구해야 합니다.