currenttarget和target的区别

以你之姓@ 2023-07-17 15:57 32阅读 0赞

**currentTarget 定义和用法**

currentTarget 事件属性返回其监听器触发事件的节点，即当前处理该事件的元素、文档或窗口。  
在捕获和起泡阶段，该属性是非常有用的，因为在这两个节点，它不同于 target 属性。

语法：event.currentTarget

<html>
    <head>
    
    <script type="text/javascript">
    function getEventTrigger(event)
      {  
      x=event.currentTarget; 
      alert("The id of the triggered element: "
      + x.id);
      }
    </script>
    </head>
    
    <body >
    
    <p id="p1" onmousedown="getEventTrigger(event)">
    Click on this paragraph. An alert box will
    show which element triggered the event.</p>
    
    </body>
    </html>

**target定义和用法**  
target 事件属性可返回事件的目标节点（触发该事件的节点），如生成事件的元素、文档或窗口。

语法：event.target

**区别：**  
当没有事件委托的时候，currenttarge和target指的时同一个元素，如上面的案例  
当有事件委托的时候，currenttarget一般指的是委托事件的元素，大多数时父元素，而目标元素是子元素

$(document).ready(function(){ 
    	  $("div").on("click","button",function(event){ 
    		  console.log("currenttarget: "+JSON.stringify(event));
    		   console.log("target: "+event.target)
    	    $(event.delegateTarget).css("background-color", "pink");
    	  });
    	});

上面的例子：'div’是currenttarget，'button’是target

发表评论取消回复

表情：

评论列表（有 0 条评论，32人围观）

还没有评论，来说两句吧...

相关阅读

相关 event.target和event.CurrentTarget的区别专业解释

区别 Use event.currentTarget instead of event.target because of event bubbling/captur...

绝地灬酷狼/ 2024年04月17日 05:34/ 0 赞/ 101 阅读

相关 Event.target与event.currentTarget

Event.target：指的是真正触发事件的元素节点 Event.currentTarget：指的是绑定了事件监听的元素 event.target经常使用的属性:

小咪咪/ 2023年10月05日 22:38/ 0 赞/ 113 阅读

相关 currenttarget和target的区别

currentTarget 定义和用法 currentTarget 事件属性返回其监听器触发事件的节点，即当前处理该事件的元素、文档或窗口。在捕获和起泡阶段，该属性是非

以你之姓@/ 2023年07月17日 15:57/ 0 赞/ 33 阅读

相关 event.target 和 event.currentTarget 的区别

event.target > This property of event objects is the object the event was dispatched

喜欢ヅ旅行/ 2023年06月25日 02:21/ 0 赞/ 101 阅读

相关简单几句话彻底理解Javascript中target与currentTarget的区别

Javascript中target与currentTarget的区别是老生常谈的问题。尤其是作为面试题可以考察应聘者对于JS事件的理解。 JS中的事件触发是一个过程，即

悠悠/ 2022年12月16日 11:00/ 0 赞/ 181 阅读

相关小程序中e.target与e.currentTarget区别详解【转】

在小程序中，e.target与e.currentTarget是非常重要的，尤其是涉及到页面传值时！本节只说两者的区别，关于传值下一节再详细讲解>[https://blog.cs

梦里梦外;/ 2022年12月01日 11:47/ 0 赞/ 237 阅读

相关小程序中e.target与e.currentTarget区别详解

在小程序中，e.target与e.currentTarget是非常重要的，尤其是涉及到页面传值时！本节只说两者的区别，关于传值下一节再详细讲解>[https://blog.cs

太过爱你忘了你带给我的痛/ 2022年05月18日 05:39/ 0 赞/ 233 阅读

相关小程序动态添加class 以及点击捕获currentTarget和target的区别

简述由于微信小程序开发不同于以往的普通web开发, 因此无法通过js获取wxml文件的dom结构, 因此从js上直接添加一个类名应该不可能了. 可是我们可以通过微信小程

ゞ浴缸里的玫瑰/ 2022年05月15日 07:53/ 0 赞/ 837 阅读

相关 Event.currentTarget，Event.target

`Event.currentTarget` 属性返回事件当前所在的节点，即正在执行的监听函数所绑定的那个节点。 `Event.target` 属性返回原始触发事件的那个节点，

我不是女神ヾ/ 2022年03月15日 18:05/ 0 赞/ 269 阅读

相关 e.target与e.currentTarget的作用

转载：https://blog.csdn.net/magic\_\_man/article/details/51781425 event.target 返回触发事件的元素

古城微笑少年丶/ 2021年09月15日 12:06/ 0 赞/ 422 阅读