javascript 跨浏览器的一些小技巧

    用网页调整格式实在是太复杂了，凑合看看吧。。。。。

1.   事件处理分为两种，一种为冒泡型事件，另一种为捕获型事件
     冒泡型事件 ：是从特定目标到最不特定的目标
     捕获型事件 ：是从最不特定的对象开始触发，一直到最精确的对象。
    
    DOM 标准同时支持两种事件，并且捕获型事件先发生。
    window-->document-->body-->div-->div-->body-->document-->window
    
     比较特殊的，在 DOM 事件模型中，文本节点也会触发事件，而 IE 中是不会的。
    window-->document-->body-->div-->text-->text-->div-->body-->document-->window
    
    
2. IE 和 DOM 在事件及事件处理中有很多不一样的。

•   对于加载监听和移除监听的语法
    在 IE 中使用
    [Object].attachEvent("name_of_event_handler", fnHandler);
    [Object].detachEvent("name_of_event_handler", fnHandler);
    两个参数：要分配的事件处理函数的名字 和 事件处理函数
    [Object].attachEvent("onclick", fnHandler);
     与 [Object].onclick = fnHandler; 的作用是一样的。
    
    在 DOM 中使用
    [Obejct].addEventListener("name_of_event", fnHandler, bCapture);
    [Obejct].removeEventListener("name_of_event", fnHandler, bCapture);
    三个参数： 1 ：事件名称。 2 ：事件处理函数。 3 ：用于冒泡阶段（ false ）或者用于捕获阶段（ true ）。
    [Obejct].addEventListener("click", fnHandler, false);
     与 [Obejct].onclick = fnHandler; 的作用是一样的。
    
   
• 对于获取目标的方法
    在 IE 中
    var oTarget = oEvent.srcElement;
    在 DOM 中
    var oTarget = oEvent.target;
    
    
• 对于获取字符代码

    在 IE 中

      如果按键代表一个字符（非 Shift 、 Ctrl 、 Alt 等），则 keyCode 将返回字符的代码，即 Unicode 值。

在 DOM 中
              获得字符代码用 charCode 

var iCharCode = oEvent.charCode;
              获得字符使用   

 var sChar = String.fromCharCode(oEvent.charCode);
              如果不确定按键是否包含字符，则使用 isChar 来判断
   if(oEvent.isChar){
    var iCharCode = oEvent.charCode;
   }
 
 

• 阻止事件的默认行为 ( 比如阻止鼠标右键等 )
    在 IE 中
    oEvent.returnValue = false;
    在 DOM 中
    oEvent.preventDefault();
   
   
• 停止事件冒泡
    在 IE 中
    oEvent.cancelBubble = true;
    在 DOM 中
    oEvent.stopPropagation();
  
  IE 和 DOM 在事件及事件处理中有很多不一样的。

把 IE 的 Event 事件统一成 DOM 的形式，创建 formatEvent 方法。建立 EventUtil 类
   

    EventUtil.formatEvent = function (oEvent){
  if(isIE){
   oEvent.charCode = (oEvent.type == "keypress") ? oEvent.keyCode : 0;
   oEvent.eventPhase = 2; //代表冒泡阶段，IE仅支持冒泡阶段
   oEvent.isChar = (oEvent.charCode > 0);
   oEvent.pageX = oEvent.clientX + document.body.scrollLeft;
   oEvent.pageY = oEvent.clientY + document.body.scrollTop;
   oEvent.preventDefault = function (){
    this.returnvalue = false;
   }
   if(oEvent.type == "mouseout"){
    oEvent.relatedTarget = oEvent.toElement;
   }else if(oEvent.type == "mouseover"){
    oEvent.relatedTarget = oEvent.fromElement;
   }
   oEvent.stopPropagation = function (){
    this.cancelBubble = true;
   }
   oEvent.target = oEvent.srcElement;
   oEvent.time = (new Date).getTime();
  }
  return oEvent;
 }

  

 
 IE

与 DOM 的 event 获取方法也不大一样。特别说明的是函数的 caller 属性。每个函数都有 caller 属性，指向调用它的方法的引用。即， funcA() 调用 funcB(),funcB.caller 就等于 funcA
 

    EventUtil.getEvent = function(){
  if(window.event){
   return this.formatEvent(window.event);
  }else{
   return EventUtil.getEvent.caller.arguments[0];//event对象总是事件处理函数的第一个参数。
  }
 }

  

javascript 跨浏览器的一些小技巧