<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
body{height:2000px;}
div#outer{
background:rgba(0,0,0,0.8);
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
}
div#inner{position: absolute;left: 50%;top: 50%;margin: -200px 0 0 -200px; width: 400px; height: 400px;}
</style>
</head>
<body>
<div id="outer">
<div id="inner">inner</div>
</div>
<script type="text/javascript">
var oOuter= document.getElementById("outer");
oDiv.onclick = function(ev){
debugger;//ev.target==div#inner--------ev.currentTarget==div#outer
}
</script>
</body>
</html>

target在事件流的目标阶段;currentTarget在事件流的捕获,目标及冒泡阶段。只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的对象而currentTarget指向当前事件活动的对象(一般为父级)。

target与currentTarget区别 ( html是弹窗居中的例子)的更多相关文章

  1. JavaScript target与currentTarget区别

    1.DOM事件绑定到父元素 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=& ...

  2. 微信小程序中的target和currentTarget区别

    最近在学习微信小程序相关知识,其中提到了两个属性target和currentTarget,其中target是指向触发事件的元素(常见于事件委托中),而currentTarget是指向捕获事件的元素(即 ...

  3. jS事件:target与currentTarget区别

    target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的 ...

  4. 事件:target与currentTarget区别

    target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的 ...

  5. target与currentTarget区别

    target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的 ...

  6. target和currentTarget的区别

    target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的 ...

  7. 事件冒泡和事件捕获以及解释target和currenttarget的区别

    冒泡和捕获的区别是冒泡事件是先触发子元素事件,再触发父元素事件,这个是冒泡.捕获是先触发父元素事件,再触发子元素事件.简单的来说,冒泡的顺序是由内到外,捕获的顺序是由外到内 举例:<!DOCTY ...

  8. 关于js中event的target和currentTarget的区别

    今天又遇到这个问题了,总是搞不清楚target和currentTarget的区别,百度搜索的时候看到一遍文章解释得很清楚,特意记录下录,以备不时之需: target与currentTarget的区别? ...

  9. target与currentTarget与this的区别

    target与currentTarget与this的区别: target在事件流的目标阶段:currentTarget在事件的捕获.目标及冒泡阶段. 只有当事件流处在目标阶段的时候,二者的指向才是一致 ...

随机推荐

  1. jquery easyui-datagrid/treegrid 清空数据参考

    在使用easyui的treegrid或datagrid的过程经常会有这样的场景,如:需要按不同的类型加载数据时,如果选择的分类下没有数据应该把上次展示的数据清空,以免引用歧义.下面给出两种方法供初学者 ...

  2. python脚本生成exe可执行文件

    1.先安装第三方插件: py2exe. Get py2exe from http://www.py2exe.org/ 在download里下载与自己python对应的版本 2.写一个测试python文 ...

  3. docker-compose编写(英文)

    原文地址:https://docker.github.io/compose/compose-file/ Compose file reference The Compose file is a YAM ...

  4. Python学习第一天 -- 简单的属性、 语法学习

    1,哈哈哈,是时候来一波Python,其实没办法,最近在做后台的时候,需要用到Python来调试接口,下面是它的简单的语法,权当是记录. 2, #!/user/bin/python # coding= ...

  5. 什么是Cookie对象,Session对象,Application对象。

    Cookie是: 一个由网页服务器放在您硬盘上的非常小的文本文件. 它本质上就像您的身份证明一样,并且不能像代码那样被执行或被用来散布病毒.它只能被您使用并且只能由提供的服务器读取. 使用Cookie ...

  6. $.Ajax({});方法使用 返回json格式 string格式

    //Json格式 $.ajax({ url: url + "?action=Save1", type: "post", dataType: "json ...

  7. CEGUI环境配置

    由于最近项目需要CEGUI做界面,于是我去下载了CEGUI源码,但是却不知道怎么搭建.网上的教程都不是很详细,不能让我们这种新手理解,经过几天折腾,终于弄好了,特此记录下来. 1.下载官网CEGUI源 ...

  8. window10 安装SVN 提示权限问题

     http://www.yishimei.cn/network/551.html 经常在网上看到有同学反映,他们在控制面板里卸载软件的时候,总是会出现2502.2503错误代码的问题,并且这个问题大多 ...

  9. ios safari 标签发送到桌面自定义图标方法

    iphone 修改safari 发送到桌面图标 试了几次,总结如下: 1.全屏方法 <meta name="viewport" content="width=dev ...

  10. ImageView cannot be resolved to a type

    问题: ImageView cannot be resolved to a type 报这样的错误是没有加载MainActivity.java文件中加入 import android.widget.I ...