JavaScriptデザインモード_外観モード

複雑なサブシステムインタフェースのセットにより、サブシステムインタフェースへのアクセスが容易になります.すなわち、下位パッケージ化により、外観モードで定義された統合インタフェースの使用を簡素化し、EventUtilオブジェクトなどのブラウザー互換性の問題を解決することができます(これは外観モードアプリケーションの一部にすぎません).多くのコードライブラリは、外観モードで複数の機能をカプセル化し、最下位の操作方法を簡素化します.

	
		
		

		
			window.οnlοad=function(){
				
				var EventUtil={
					
					addHandler:function(element,type,handler){
						if(element.addEventListener){//  DOM2   
							element.addEventListener(type,handler,false);							
						}else if(element.attachEvent){//IE   
							element.attachEvent(type,handler,false);							
						}else{
							element["on"+type]=handler;//DOM0   ，          ，    ，            。
						}				
					},
					
					removeHandler:function(element,type,handler){  //    
			      if(element.removeEventListener){
			         element.removeEventListener(type,handler,false);
			      }else if(element.detachEvent){
			         element.detachEvent("on"+type,handler);
			      }else{
			         element["on"+type]=null;
			      }
			   	},
			 
				  getEvent:function(event){  //            event  
			      return event?event:window.event;
				   },
					
				  getTarget:function(event){  //         
			      return event.target||event.srcElement;
				   },
				
			   	preventDefault:function(event){   //         
			      if(event.preventDefault){
			         event.preventDefault(); 
			      }else{
			         event.returnValue=false;
			      }
			   	},
			 
			   	stopPropagation:function(event){  //       DOM    
			                                     //       document.body         
			      if(event.stopPropagation){
			         event.stopPropagation();
			      }else{
			         event.cancelBubble=true;
			      }
			 	  }
				}
				
				var btn1 = document.getElementById("myBtn1");
				var handler = function(){
                                   alert("hello");
				}
	 			EventUtil.addHandler(btn1, "click", handler);
			}
		
	
	
		  
		
 F12