event.target指向谁？
学习中，有时遇到event.target，总是不明白为什么要用target，后来学习了下，大概了解了event.target到底指什么元素了，关于event和this的内容，下回再说：
先摆结论：event.target指向事件执行时鼠标所点击（假设是click事件）区域的那个元素。如果事件绑定的元素内部有子元素，那么event.target指向这个子元素，如果没有，event.target指向事件所绑定的元素。看代码：
<html>
<head>
<title>prac</title>
<meta charset="utf-8">
<style type="text/css">
*{margin:0;padding:0;font-size: 20px;}
#div1{background-color: lightblue;height: 300px;}
#p1{background-color: red;height: 100px;}
#p2{background-color: pink;height: 100px;}
</style>
<script type="text/javascript">
function getEventTrigger(event)
{
x=event.target;
alert("event.target元素的id: " + x.id+"，事件类型:"+event.type);
}
</script>
</head>
<body >
<div id="div1" onmousedown="getEventTrigger(event)">
<p id="p1">我是p1</p>
<p id="p2">我是p2</p>
父块div1剩下的部分
</div>
</body>
</html>
如上图：给父块div1绑定mousedown事件，调用函数getEventTrigger,弹出event.target元素的id:和事件类型，div1里面加了两个子元素，p1和p2,剩下的是div1没有被覆盖的部分；
效果如下：当你在p1里按下鼠标时，弹出p1的id；p2里按下鼠标时，弹出p2的id；在div1里按下鼠标时，弹出的就是div1的id；
也就验证了上面的结论：event.target指向事件执行时鼠标所点击（假设是click事件）区域的那个元素。如果事件绑定的元素内部有子元素，那么event.target指向这个子元素，如果没有，event.target指向事件所绑定的元素。
后面再附个链接和w3school的解释，感觉解释的不清楚，不过案例是用他的代码改的，嘿嘿
target 事件属性可返回事件的目标节点（触发该事件的节点），如生成事件的元素、文档或窗口。
http://www.w3school.com.cn/jsref/event_target.asp
event.target指向谁？的更多相关文章
- event.target 和 event.currentTarget 的区别
event.target This property of event objects is the object the event was dispatched on. It is differe ...
- 小结event.target与this
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...
- event.currentTarget指向事件所绑定的元素，而event.target始终指向事件发生时的元素
event.currentTarget指向事件所绑定的元素,而event.target始终指向事件发生时的元素
- 【前端】event.target 和 event.currentTarget 的区别
event.target 和 event.currentTarget 的区别 举例说明: <!DOCTYPE html> <html> <head> <tit ...
- event.srcElement与event.target的区别
window.event.srcElement与window.event.target 都是指向触发事件的元素,它是什么就有什么样的属性 srcElement是事件初始化目标html元素对象引用,因为 ...
- Event.target和Event.currentTarget的区别
<style> * { margin:0; padding:0; list-style:none; } #ul { width:400px; height:250px; margin:0 ...
- window.event.srcElement与window.event.target 触发事件的元素 触发事件对象的获取，window.event与时间函数参数的event是同一个 事件对象
判断事件触发的元素: var tag = window.event.target || window.event.srcElement; if (tag.tagName.toLowerC ...
- event.currentTarget与event.target的差别介绍
event.currentTarget与event.target的差别想大家在使用的时候不是非常在意.本文以測试代码来解说它门之间的不同.即,event.currentTarget指向事件所绑定的元素 ...
- window.event.srcElement与window.event.target 触发事件的元素
IE浏览器支持window.event.srcElement , 而firefox支持window.event.target:<input type="text" onblu ...
随机推荐
- 【 2013 Multi-University Training Contest 1 】
HDU 4602 Partition f[i]表示和为i的方案数.已知f[i]=2i-1. dp[i]表示和为i,k有多少个.那么dp[i]=dp[1]+dp[2]+...+dp[i-1]+f[i-k ...
- 驱动插ring3线程执行代码
近日有在写一个小东西 需要在内核态中运行一个WIN32程序 之前提到的插入APC可以满足部分要求 但是一到WIN7 x86平台下就崩溃了WIN7下只能插入第三方的进程 一插入系统进程就崩溃,但是这样满 ...
- Linux学习 ：Uboot, Kernel, 根文件系统初步分析
1.U-Boot启动内核的过程可以分为两个阶段: 1)第一阶段的功能 硬件设备初始化 加载U-Boot第二阶段代码到RAM空间 设置好栈 跳转到第二阶段代码入口 2)第二阶段的功能 初始化本阶段使用的 ...
- cisco vpn client 自动登陆脚本
cisco vpn client 不能保存密码,每次都要输入太麻烦了 写了个wsh,可以自动输入密码,并登陆 '需要一个好听的名字 <job id="cisco"> ' ...
- Pressure-sensitive pores scattered
Some researchers take issue with this however - a shark's vision is too good and its sense of smell ...
- Nginx 1.10.2 发布，高性能 Web 服务器
Nginx 1.10.2 发布了.Nginx(发音同 engine x)是一款轻量级的Web 服务器/反向代理服务器及电子邮件(IMAP/POP3)代理服务器 更新内容: Changes with n ...
- 'java'不是内部或外部命令，另一个解决办法
我知道环境变量,也知道搞系统变量.别给我粘那些教程了,我的java路程是C:\Program Files\Java\jdk1.6.0_05谁弄好了把那三个变量和值发出来.... JAVA_HOME=C ...
- 持续集成配置-Teamcity
1.安装目录\buildagent\work\每个项目下一个文件夹\src下是源 目的: 2. 安装目录\buildagent\work\每个项目下一个文件夹\src下是源 目的是teamcity中配 ...
- md5应用
/* md5工具类 */ public class MD5Util { /**全局数组**/ private final static String[] strDigits = { "0&q ...
- 第六篇——初尝Python，意犹未尽
作业2的要求是选一个你从来没有学过的编程语言,试一试实现基本功能.那么在这里我准备学习Python语言进行学习,并尝试用Python写一写东西. http://www.runoob.com/ Pyth ...