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 相关文章推荐
event.currentTarget与event.target的区别介绍
Dec 31 Javascript
用jquery方法操作radio使其默认选项是否
Sep 10 Javascript
Javascript排序算法之合并排序(归并排序)的2个例子
Apr 04 Javascript
jQuery基础语法实例入门
Dec 23 Javascript
仿百度换肤功能的简单实例代码
Jul 11 Javascript
Js删除数组中某一项或几项的几种方法(推荐)
Jul 27 Javascript
谈谈JS中常遇到的浏览器兼容问题和解决方法
Dec 17 Javascript
JavaScript ES6中export、import与export default的用法和区别
Mar 14 Javascript
JavaScript中利用Array filter() 方法压缩稀疏数组
Feb 24 Javascript
vue-router懒加载速度缓慢问题及解决方法
Nov 25 Javascript
详解基于React.js和Node.js的SSR实现方案
Mar 21 Javascript
详解element-ui日期时间选择器的日期格式化问题
Apr 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采集时被封ip的解决方法
2010/08/29 PHP
PHP和Mysqlweb应用开发核心技术 第1部分 Php基础-1 开始了解php
2011/07/03 PHP
php_screw安装使用教程(另一个PHP代码加密实现)
2014/05/29 PHP
php创建session的方法实例详解
2015/01/27 PHP
php flush无效,IIS7下php实时输出的方法
2016/08/25 PHP
深入理解PHP的远程多会话调试
2017/09/21 PHP
laravel框架实现为 Blade 模板引擎添加新文件扩展名操作示例
2020/01/25 PHP
javascript removeChild 使用注意事项
2009/04/11 Javascript
读jQuery之十 事件模块概述
2011/06/27 Javascript
Javascript中的Array数组对象详谈
2014/03/03 Javascript
Javascript玩转继承(二)
2014/05/08 Javascript
推荐一个封装好的getElementsByClassName方法
2014/12/02 Javascript
浅析JavaScript函数的调用模式
2016/08/10 Javascript
jQuery EasyUi 验证功能实例解析
2017/01/06 Javascript
微信小程序新增的拖动组件movable-view使用教程
2017/05/20 Javascript
vue中将网页打印成pdf实例代码
2017/06/15 Javascript
vue.js内部自定义指令与全局自定义指令的实现详解(利用directive)
2017/07/11 Javascript
mac上配置Android环境变量的方法
2018/07/08 Javascript
小程序开发基础之view视图容器
2018/08/21 Javascript
详解在vue-cli项目下简单使用mockjs模拟数据
2018/10/19 Javascript
vue使用better-scroll实现滑动以及左右联动
2020/06/30 Javascript
总结用Pdb库调试Python的方式及常用的命令
2016/08/18 Python
教大家玩转Python字符串处理的七种技巧
2017/03/31 Python
详解Ubuntu16.04安装Python3.7及其pip3并切换为默认版本
2019/02/25 Python
PyTorch实现ResNet50、ResNet101和ResNet152示例
2020/01/14 Python
基于Pycharm加载多个项目过程图解
2020/01/19 Python
python实现滑雪者小游戏
2020/02/22 Python
python实现控制台输出彩色字体
2020/04/05 Python
如何在windows下安装Pycham2020软件(方法步骤详解)
2020/05/03 Python
python中Pexpect的工作流程实例讲解
2021/03/02 Python
聚美优品励志广告词
2014/03/14 职场文书
一年级小学生评语
2014/04/22 职场文书
调研座谈会发言材料
2014/08/23 职场文书
2014大学生批评与自我批评思想汇报
2014/09/21 职场文书
交通事故协议书范文
2014/10/23 职场文书
2016自主招生教师推荐信范文
2015/03/23 职场文书