JS target与currentTarget区别说明


Posted in Javascript onAugust 28, 2011
<div id="outer" style="background:#099"> 
click outer 
<p id="inner" style="background:#9C0">click inner</p> 
<br> 
</div> <script type="text/javascript"> 
function G(id){ 
return document.getElementById(id); 
} 
function addEvent(obj, ev, handler){ 
if(window.attachEvent){ 
obj.attachEvent("on" + ev, handler); 
}else if(window.addEventListener){ 
obj.addEventListener(ev, handler, false); 
} 
} 
function test(e){ 
alert("e.target.tagName : " + e.target.tagName + "\n e.currentTarget.tagName : " + e.currentTarget.tagName); 
} 
var outer = G("outer"); 
var inner = G("inner"); 
//addEvent(inner, "click", test); 
addEvent(outer, "click", test); 
</script>

上面的示例中,当在outer上点击时,e.target与e.currentTarget是一样的,都是div;当在inner上点击时,e.target是p,而e.currentTarget则是div。
Javascript 相关文章推荐
javascript实现动态增加删除表格行(兼容IE/FF)
Apr 02 Javascript
JavaScript高级程序设计 扩展--关于动态原型
Nov 09 Javascript
Javascript图像处理—为矩阵添加常用方法
Dec 27 Javascript
JavaScript获取onclick、onchange等事件值的代码
Jul 22 Javascript
基于jquery扩展漂亮的下拉框可以二次修改
Nov 19 Javascript
javascript实现playfair和hill密码算法
Dec 07 Javascript
基于JavaScript怎么实现让歌词滚动播放
Nov 03 Javascript
jquery及js实现动态加载js文件的方法
Jan 21 Javascript
浅谈JavaScript中小数和大整数的精度丢失
May 31 Javascript
vue3.0 CLI - 3.2 路由的初级使用教程
Sep 20 Javascript
Vue.js 事件修饰符的使用教程
Nov 01 Javascript
简单了解vue中的v-if和v-show的区别
Oct 08 Javascript
IE6,IE7,IE8下使用Javascript记录光标选中范围(已补全)
Aug 28 #Javascript
range 标准化之获取
Aug 28 #Javascript
dojo学习第一天 Tab选项卡 实现
Aug 28 #Javascript
js中设置元素class的三种方法小结
Aug 28 #Javascript
IE6、IE7中setAttribute不支持class/for/rowspan/colspan等属性
Aug 28 #Javascript
IE6、IE7中获取Button元素的值的bug说明
Aug 28 #Javascript
JavaScript 选中文字并响应获取的实现代码
Aug 28 #Javascript
You might like
php防注入,表单提交值转义的实现详解
2013/06/10 PHP
浅析php适配器模式(Adapter)
2014/11/25 PHP
匹配任意字符的正则表达式写法
2010/04/29 Javascript
javascript权威指南 学习笔记之javascript数据类型
2011/09/24 Javascript
jquery.bgiframe.js在IE9下提示INVALID_CHARACTER_ERR错误
2013/01/11 Javascript
JavaScript动态创建link标签到head里的方法
2014/12/22 Javascript
png在IE6 下无法透明的解决方法汇总
2015/05/21 Javascript
JavaScript数据类型转换的注意事项
2016/07/31 Javascript
深入理解jQuery.data() 的实现方式
2016/11/30 Javascript
利用JS实现简单的日期选择插件
2017/01/23 Javascript
微信小程序删除处理详解
2017/08/16 Javascript
Bootstrap3.3.7导航栏下拉菜单鼠标滑过展开效果
2017/10/31 Javascript
使用vue-router为每个路由配置各自的title
2018/07/30 Javascript
浅谈Vue服务端渲染框架Nuxt的那些事
2018/12/21 Javascript
vue+iview动态渲染表格详解
2019/03/19 Javascript
JavaScript实现移动端弹窗后禁止滚动
2020/05/25 Javascript
[02:52]2014DOTA2西雅图国际邀请赛 CIS战队巡礼
2014/07/07 DOTA
[35:29]Secret vs VG 2018国际邀请赛淘汰赛BO3 第三场 8.23
2018/08/24 DOTA
Python 调用DLL操作抄表机
2009/01/12 Python
Python程序中用csv模块来操作csv文件的基本使用教程
2016/03/03 Python
python面向对象_详谈类的继承与方法的重载
2017/06/07 Python
Python3实现将本地JSON大数据文件写入MySQL数据库的方法
2018/06/13 Python
python实现旋转和水平翻转的方法
2018/10/25 Python
Python3爬虫使用Fidder实现APP爬取示例
2018/11/27 Python
Python3.0中普通方法、类方法和静态方法的比较
2019/05/03 Python
numpy按列连接两个维数不同的数组方式
2019/12/06 Python
Anconda环境下Vscode安装Python的方法详解
2020/03/29 Python
Python3爬虫关于识别检验滑动验证码的实例
2020/07/30 Python
EVE LOM英国官网:全世界最好的洁面膏
2017/10/30 全球购物
长青弘远的面试题
2012/06/09 面试题
毕业生自我推荐
2013/11/04 职场文书
分公司经理任命书
2014/06/05 职场文书
Canvas跟随鼠标炫彩小球的实现
2021/04/11 Javascript
关于Python OS模块常用文件/目录函数详解
2021/07/01 Python
Python时间操作之pytz模块使用详解
2022/06/14 Python
Redis过期数据是否会被立马删除
2022/07/23 Redis