DOM的不兼容也說明了DOM高級特性Event的不兼容,因為我們在開發Web的時候,和用戶的大量交互都是通過event來實現的,所以單獨把event抽出來,把其不兼容性列出:
Event的兼容性
1.事件流的區別
IE 冒泡事件流 在IE6增加<html>等元素對事件流的響應
Mozillal 冒泡事件流 在IE6的基礎上增加window對象對事件流的響應
Netscape 捕獲事件流 同Mozillal
DOM標準 冒泡+捕獲 增加文本節點對事件流的響應;同時冒泡+捕獲使得事件目標連續接收2次事件
(這可能是DOM的事件增加函數有第3個參數的原因)
2.事件處理函數
IE attach(eventName, fn)、 eventName=on+事件名
detachEvent(eventName, fn)
DOM addEventListener(eventName,fn,boolean)
removeEventListener(eventName,fn,boolean) eventName=事件名;
boolean=true:捕獲|false:冒泡
remove只有同事件流才能起效
3.事件對象
定位 IE:window.event; window.event||arguments[0]
DOM:arguments[0](事件處理函數的參數),可以通過caller來防止硬編碼獲??;
事件目標 IE:event.srcElement event.srcElement||event.target
DOM:event.target
阻止事件 IE: event.returnValue = true if(isIE){window.event.returnValue = true;}
默認行為 DOM: event.preventDefault() else{arguments[0].preventDefault();}
3.1 鼠標事件[對象]
鼠標位置 IE:event.x,event.y event.x?event.x:event.PageX
DOM:event.pageX, event.pageY event.y?event.y:event.PageY
進入事件1 IE :onmouseenter, onmouseleave 它們的區別在于處理嵌套dom object出入上,只有
DOM:mouseover,mouseout DOM標準才進行處理,enter/leave會忽略,也就是說
(fromElement!=toElement) && (this.contains(toElement) 觸發onmouseover
(fromElement!=toElement) && (this.contains(fromElement) ) 觸發onmouseout
進入事件2 IE:event.fromElement|toElement,
event.srcElement
DOM: target,relatedTarget 對于mouseover:fromElement=relatedElement,toElement = srcElement=target;
對于mouseout : toElement=relatedElement,fromElement = srcElement=target;
3.2 鍵盤事件
字符代碼 IE:event.keyCode;DOM: 數值代碼-event.keyCode。event.isChar?event.charCode:event.keyCode ,在FF中,keyCode只能獲得功能鍵的數值代碼,其他的需通過which和charCode,在Opera中,則只能通過which