event.currentTarget和document.activeElement用法

2024-07-11 08:24:50

字體：大中小

來源：轉載

供稿：網友

firefox 的 event.currentTarget 和 ie 的 document.activeElement 這兩個完全含義不一致的對象卻被捆綁在一起做成了瀏覽器兼容代碼。大家在google搜索的時候都會發(fā)現 document.activeElement || event.currentTarget 的用法。
其實這樣的用法是錯誤的，因為這兩個屬性的意義都不一樣。
event.currentTarget
Identifies the current target for the event, as the event traverses the DOM.
識別當前事件觸發(fā)的dom
document.activeElement
Gets the object that has the focus when the parent document has focus.
獲得當前focus的對象
例子<script type="text/javascript">
var show = function (e) {
alert(e.currentTarget?"獲取到了 currentTarget":"獲取到了 document.activeElement")
alert((e.currentTarget || document.activeElement).tagName);
};
</script> 案例1: <a href="#"><img src="http://www.google.cn/images/nav_logo3.png" border="0" alt="" onclick="show(event)"/></a> 案例2: <a href="#" onclick="show(event)"><img src="http://www.google.cn/images/nav_logo3.png" border="0" alt=""/></a> 
 這兩個案例,在ie和firefox下試驗一下。
最后測試補充：后來測試了一下 document.activeElement 的支持程度，發(fā)現四大瀏覽器safari除外, ie firefoxopera都提供了這個對象的支持。但是有點需要注意的，上面的例子中 opera 會把圖片作為可以 focus的對象。導致document.activeElement的結果不一致...

上一篇：CSS網頁設計時關于字體大小的設計

下一篇：不要使用的HTML標簽(WEB標準網頁布局)