当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > event.currentTarget和document.activeElement用法

CSS样式表
DIV+CSS网页制作这种叫法不准确
CSS初学者入门:使用table布局网页不明智
xHTML+CSS网页制作和搜索引擎优化SEO的关系
CSS控制页面样式的4种方式和优先级问题
CSS入门教程:CSS选择器
CSS基础入门教程:CSS选择器规范化命名
CSS基础入门教程:理解盒子模型
CSS教程:2个重要概念块状元素和内联元素
CSS实例:盒模型、块状元素与内联元素、CSS选择器
css实例教程:理解Float的含义
CSS实例教程:清除浮动Clear
CSS网页制作教程:制作网页导航条
CSS实例教程:浮动(float)页面布局
CSS实例教程:定位(position)布局页面
CSS实例教程:用position来布局页面
CSS实例教程:CSS Hack
CSS制作网页技巧:单图片按钮实例
CSS网页制作入门实例:首行缩进两个文字
2天掌握DIV+CSS网页制作技术
CSS网页定位教程:详细学习定位知识

CSS样式表 中的 event.currentTarget和document.activeElement用法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-11   浏览: 191 ::
收藏到网摘: n/a


firefox 的 event.currentTarget 和 ie 的 document.activeElement 这两个完全含义不一致的对象却被捆绑在一起做成了浏览器兼容代码。 大家在google搜索的时候 都会发现 document.activeElement || event.currentTarget 的用法。
其实这样的用法是错误的,因为这两个属性的意义都不一样。
event.currentTarget
Identifies the current target for the event, as the event traverses the DOM.
识别当前事件触发的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><BR> 案例1: <br/><BR> <a href="#"><img src="http://www.google.cn/images/nav_logo3.png" border="0" alt="" onclick="show(event)"/></a> <br/> <br/><BR> 案例2: <br/><BR> <a href="#" onclick="show(event)"><img src="http://www.google.cn/images/nav_logo3.png" border="0" alt=""/></a> <br/><P></P>
<P> 这两个案例,在ie和firefox下试验一下。</P>
最后测试补充:后来测试了一下 document.activeElement 的支持程度,发现四大浏览器safari除外, ie firefoxopera都提供了这个对象的支持。但是有点需要注意的,上面的例子中 opera 会把图片作为 可以 focus的对象。导致document.activeElement的结果不一致...