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对象总是事件处理函数的第一个参数。
  }
 }

?

?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?

?

?