dom对象中的this和event.target区别

最新推荐文章于 2022-02-08 23:07:56 发布
转载 最新推荐文章于 2022-02-08 23:07:56 发布 · 332 阅读 · 0
文章标签：

#html #this #event.target

本文详细解析了DOM事件处理中的this关键字与event.target属性的区别。通过实例演示了this随事件冒泡而动态变化的特点，以及event.target始终指向最初触发事件元素的特性。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

dom对象中的this和event.target区别
1.this是事件冒泡，动态变化。先触发内部事件，由内到外的执行。

复制代码

<body>
    <div onclick="testdiv(this)" id="testdiv">
        <a href="#" onclick="testa(this)" id="testa">click me</a>
    </div>
</body>

复制代码
运行结果

2.event.target代表的是触发事件的dom对象，是静态不变的。

复制代码

<body onclick="testbody()">
    <div onclick="testdiv()" id="testdiv">
        <a href="#" onclick="testa()" id="testa">click me</a>
    </div>
</body>

复制代码
运行结果

总结：两者都代表dom对象，如果需要调用jquery的方法可以这样 ( t h i s ) , (this), (this),(event.target)。

使用jq获取DOM对象的this和event.target
NsbiCs的博客
10-10 353
通过上述方法，你可以方便地获取到当前操作的DOM对象和事件触发的目标DOM对象，从而在使用jq进行DOM操作时更加灵活和便捷。在使用jQuery（简称jq）处理DOM操作时，经常需要获取当前操作的DOM对象以及事件触发的目标DOM对象。关键字时，它将指向当前操作的DOM对象。无论是绑定了点击事件、改变事件还是其他事件，都可以使用。关键字转换为一个jq对象，从而获得当前操作的DOM对象。来获得事件触发的目标DOM对象。同样，可以根据需要对该对象进行进一步的操作。属性，可以获取事件触发的目标DOM对象。
jQuery中event.target和this的区别详解
11-20
　2.this和event.target都是dom对象，使用jQuey中的方法可以将他们转换为jquery对象：$(this)和$(event.target). 比如,一个很简单的例子. $(event.target)指向触发事件的元素. 当点击蓝色小方框时, 蓝色小方框会变成...
DOM基础(1)-EventTarget接口认识以及实现原理
xiongxiaolin123的博客
08-18 283
MDN链接： https://developer.mozilla.org/zh-CN/docs/Web/API/EventTarget EventTarget接口实现代码： // TEvent var TEvent = function () { this.listeners = []; } TEvent.prototype.listeners = null; TEvent.prototype.add = function(type, callback) { if (!(type i
event.target和this的区别
长河落日的博客
10-17 758
&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;style type="text/css"&gt; .box1{ width: 200px; h
Jq中event.target 与this的区别
liuboman的博客
02-21 889
event.target表示发生点击事件的元素； this表示的是注册点击事件的元素。
this和event.target的区别
等待就是浪费青春
11-04 1290
js中事件是会冒泡的，所以this是可以变化的，this默认是window对象，但event.target不会变化，它永远是直接接受事件的目标DOM元素； this和event.target都是dom对象，如果要使用jquey中的方法可以将他们转换为jquery对象：$(this)和$(event.target);
Jquery event.target与this区别
weixin_42411512的博客
08-18 197
event.target 说明：引发事件的DOM元素。this和event.target的区别 js中事件是会冒泡的，所以this是可以变化的，但event.target不会变化，它永远是直接接受事件的目标DOM元素； this和event.target的相同点 this和event.target都是dom对象，如果要使用jquey中的方法可以将他们转换为jquery对象：$(this)和$(event.target); 这使我想起了以前写的一个例子： 1 //del event 2
jquery 关于event.target使用的几点说明介绍
01-19
this和event.target的相同点this和event.target都是dom对象，如果要使用jquey中的方法可以将他们转换为jquery对象：$(this)和$(event.target); 这使我想起了以前写的一个例子： 代码如下: //del event $(“.del”)...
基于js中this和event 的区别(详解)
11-30
在JavaScript中，`this`和`event`是两个非常重要的概念，它们在处理事件和对象交互时发挥着关键作用。本文将深入探讨`this`和`event`的区别以及何时使用它们。 首先，`this`是JavaScript的一个关键字，它在不同上...
js this 和 event 的区别
weixin_30600503的博客
10-23 107
今天在看javascript入门经典-事件一章中看到了 this 和 event 两种传参形式。因为作为一个初级的前端开发人员平时只用过 this传参，so很想弄清楚，this和event的区别是什么，什么情况下用什么比较合适。 　　onclick = changeImg(this) vs onclick = changeImg(event) <img ...
e.target--- dom事件对象event
杨咩咩
03-15 2281
event不会事件冒泡，值作用于此节点对象，不会传递到父节点或子节点 标准属性： 属性 描述 bubbles 返回布尔值，指示事件是否是起泡事件类型。 cancelable 返回布尔值，指示事件是否可拥可取消的默认动作。 currentTarget 返回其事件监听器触发该事件的元素。 eventPhase 返回事件传播的当前阶段。 target...
this,target,currentTarget区别讲解
chuaizepipp202729的专栏
07-19 238
event.target 说明：引发事件的DOM元素。 this和event.target的区别 js中事件是会冒泡的，所以this是可以变化的，但event.target不会变化，它永远是直接接受事件的目标DOM元素； this和event.target的相同点 this和event.tar...
2021-06-12 event.target的定义和它与this的区别
GAARA
06-12 852
什么是event.target.value? event 常用event(或eve,e等等)来接收事件对象 event.target 事件对象作为对象,有其属性和方法,其中target属性的作用是获取触发事件的目标,即绑定事件的元素 event.target.value 获得当前元素target属性的属性值 总结: event.value获取的是当前的(点击移动等等)事件)元素 event.target.value获取的是当前元素输入(或选择)的值 event.target和this的区别是什么? 区别:
event.target 属性返回哪个 DOM 元素触发了事件。
weixin_34111819的博客
10-11 146
<ul> <li>list <strong>item 1</strong></li> <li><span>list item 2</span></li> <li>list item 3</li> </ul> <sc...
DOM事件对象中的this和target
KAMHUNCHAN的博客
02-08 270
DOM的事件机制，以及事件的捕获与冒泡
抱朴守拙
11-28 1360
事件处理，对于前端开发来说，颇为重要，知其然亦要知其所以然，所以，搞清楚浏览器 DOM 的事件机制，很有意义！ 文章目录1 事件1.1 事件：Event1.2 事件目标：EventTarget2 事件捕获与冒泡3 stopPropagation 1 事件 首先需要思考一下，何为事件？事件的本质是什么？ 事件，一言以蔽之，即 “消息” 也！在操作系统层面，也叫 “信号”。事件的工作过程中，必然涉及到三方主体：事件源、事件、事件目标。很容易理解，事件源就是事件的来源，事件特指事件过程要传递的信息，事件目标即.
jquery dom this 对象 及 绑定事件
wahaha
08-30 973
1.jquery 和dom对象 jquery对象就是被$()包裹的对象 获取文本内容时使用text() dom对象就是 html网页 获取节点文本时使用textContent 2.jquery 和dom对象的判断 var domObj = document.getElementById("id")...
event.target转jquery对象
最新发布
06-25
根据引用[1]和[2]中的信息，我们知道event.target是一个DOM元素，而jQuery对象是一个包装了DOM元素的jQuery实例。引用中明确指出：可以使用`$(event.target)`来将event.target转换为jQuery对象。同时，引用也提到了...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值