event.currentTarget和document.activeElement用法

2024-07-11 08:43:16

字體：大中小

供稿：網(wǎng)友

firefox 的 event.currentTarget 和 ie 的 document.activeElement 這兩個(gè)完全含義不一致的對(duì)象卻被捆綁在一起做成了瀏覽器兼容代碼。大家在google搜索的時(shí)候都會(huì)發(fā)現(xiàn) document.activeElement || event.currentTarget 的用法。
其實(shí)這樣的用法是錯(cuò)誤的，因?yàn)檫@兩個(gè)屬性的意義都不一樣。
event.currentTarget
Identifies the current target for the event, as the event traverses the DOM.
識(shí)別當(dāng)前事件觸發(fā)的dom
document.activeElement
Gets the object that has the focus when the parent document has focus.
獲得當(dāng)前focus的對(duì)象
例子<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> 
 這兩個(gè)案例,在ie和firefox下試驗(yàn)一下。
最后測(cè)試補(bǔ)充：后來測(cè)試了一下 document.activeElement 的支持程度，發(fā)現(xiàn)四大瀏覽器safari除外, ie firefoxopera都提供了這個(gè)對(duì)象的支持。但是有點(diǎn)需要注意的，上面的例子中 opera 會(huì)把圖片作為可以 focus的對(duì)象。導(dǎo)致document.activeElement的結(jié)果不一致...

上一篇：門戶網(wǎng)站構(gòu)建CSS框架的規(guī)則

下一篇：指定網(wǎng)頁doctype解決CSS Hacking