Loading [MathJax]/jax/input/TeX/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >专栏 >vue click点击获取点击元素

vue click点击获取点击元素

原创
作者头像
用户1349575
发布于 2022-02-14 12:47:55
发布于 2022-02-14 12:47:55
4.7K00
代码可运行
举报
文章被收录于专栏:编程社区编程社区
运行总次数:0
代码可运行
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制

<div @click="test($evnet)">点击</div>

//获取当前点击元素
methods:{
	test(e){
		console.log(e.currrentTarget)
	}
}

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

Event对象的一些兼容写法

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
// 获得event对象兼容性写法
event||(event = window.event);

//获得target兼容性写法
event.target||event,srcElement

//阻止浏览器默认行为兼容性写法
event.preventDefault ? event.preventDefault():(event.returnValue = false);

//阻止冒泡写法
event.stopPropagation ? event.stopPropagation():(event.cancelBubble = true);

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
javascript事件详解
事件流 事件流两种顺序:冒泡与捕获。 简单的添加与删除事件 obj.onclick=function(){} obj.onclick=null; 通用事件添加的删除 obj.addEventListener(),obj.attachEvent() obj.removeEventListener(),obj.attachEvent() 三个参数分别表示,(事件,绑定函数,事件流), 注意: 1.如果必须得删除事件,这种写法,不能用匿名函数,否则删除函数的时候,不方便。 2.attachEvent的事件名称是o
前朝楚水
2018/04/02
1.4K0
DOM事件探索
1.HTML事件处理程序 2.DOMO级事件处理程序 3.DOM2级事件处理程序
1025645
2018/08/23
4620
Event事件跨浏览器封装
1 var Event = { 2 //注册事件 3 addEvent: function(element,type,handler){ 4 if(element.addEventListener){ //DOM2级 5 element.addEventListener(type,handler,false); //false为冒泡,true为捕获 6 }else if(el
书童小二
2018/09/03
2560
JS 外观模式
外观模式(Facade)为子系统中的一组接口提供了一个一致的界面,此模块定义了一个高层接口,这个接口值得这一子系统更加容易使用。 外观模式在JS中常常用于解决浏览器兼容性问题。
前端下午茶
2018/10/22
1.3K0
JS-DOM2级事件对象跨浏览器处理(已封装)
1 var eventUill = { 2 //添加事件 3 addHander: function(element, type, handler) { 4 if(element.addEventListener) { 5 element.addEventListener(type, handler, false); 6 } else if(element.attachEvent) { 7 elem
xing.org1^
2018/05/17
1.2K0
react 学习(四) 批量更新及合成事件
我们上一节了解了组件的更新机制,但是只是停留在表层上,例如我们的 setState 函数式同步执行的,我们的事件处理直接绑定在了 dom 元素上,这些都跟 react 自身的逻辑不符。本小节我们学习下数据的批量更新和 react 中的事件处理。
测不准
2022/04/12
7810
react 学习(四) 批量更新及合成事件
JavaScript笔记
因为IE浏览器下不支持年月日日之间有横线连接的形式,所以在IE浏览器下做日期格式化时,需要用下面的正则表达式先将 横线转换成斜线,例如将2019-12-31 10:48:30 转成 2019/12/31 10:48:30
用户3880999
2023/04/13
2640
JavaScript笔记
JavaScript阻止冒泡和取消默认事件(默认行为)
JavaScript冒泡和捕获是事件的两种行为,使用event.stopPropagation()起到阻止捕获和冒泡阶段中当前事件的进一步传播。使用event.preventDefault()可以取消默认事件。
前端老道
2022/03/29
6.4K0
第55天:简单冒泡方法原理
事件冒泡: 当一个元素上的事件被触发的时候,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先元素中被触发。这一过程被称为事件冒泡;这个事件从原始元素开始一直冒泡到DOM树的最上层。
半指温柔乐
2018/09/11
4340
JavaScript 鼠标拖拽div 改变其大小
转自: http://www.cnblogs.com/yushang/archive/2013/03/19/2968782.html
acoolgiser
2019/01/17
1.8K0
event事件句柄的封装
版权声明:本文为吴孔云博客原创文章,转载请注明出处并带上链接,谢谢。 https://blog.csdn.net/wkyseo/article/details/51062712
空空云
2018/09/27
6770
浅谈JavaScript的事件(事件对象)
  在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含这所有与事件有关的信息。包括导致事件的元素、事件的类型和事件的相关信息。例如鼠标操作的事件中,会包含鼠标的位置信息。而键盘触发的事件会包含与按下的键有关信息。所有浏览器都支持event对象,但支持方式不同。 DOM中的事件对象   兼容dom的浏览会将一个event对象传递到事件处理程序中。 1 var aa=document.getElementById("aa"); 2 aa.onclick=functi
水击三千
2018/02/27
1.3K0
「面试常问」系统理解浏览器之事件机制
在早期 IE 和 Netscape 团队在开发第四代浏览器的时候,遇到一个问题:当点击一个按钮的时候,是应该先处理父级的事件呢?还是应该先处理按钮的事件呢?IE 和 Netscape 给出了 2 种完全相反的答案,IE 提出事件冒泡的概念,而 Netscape 则支持事件捕获。
用户4456933
2021/06/01
5720
「面试常问」系统理解浏览器之事件机制
js编程笔记之事件异常
事件处理程序的运行环境 1.ele.onxxx = function (event) {} 程序this指向是dom元素本身 2.obj.addEventListener(type, fn, false); 程序this指向是dom元素本身 3.obj.attachEvent(‘on’ + type, fn); 程序this指向window 封装兼容性的 addEvent(elem, type, handle);方法 复制代码 解除事件处理程序 ele.onclick = false/‘’/null; e
用户10094878
2022/11/21
6970
面试官:考你几个简单的事件问题吧
事件处理是JavaScript中非常重要的概念,我们使用的客户端软件往往都是事件驱动的,所以面试官特别喜欢问一些事件相关的知识,这里记录几个常见的问题,供大家学习。
kai666666
2020/10/19
1.2K0
13事件
IE8中提供的事件监听器为:element.attachEvent(eventName,functionName)
Dreamy.TZK
2020/04/24
7830
Event(事件)的传播与冒泡
特性说明和原理图: 标准浏览器和Ie9+浏览器都支持事件的冒泡和捕获,而IE8-浏览器只支持冒泡 标准和Ie9+浏览器用stopPropagation()或cancelBubble阻止事件传播,而ie8-用e.cancelBubble属性来阻冒泡,注意ie9不支持cancelBubble属性(设置后不生效),但chrome、safari、opera、firefox都支持cancelBubble属性。 Ie8-用attachEvent为dom元素添加一个事件,但必须在事件名前加上on,此类事件只能在元素的冒
sam dragon
2018/01/17
1.2K0
JavaScript事件探秘
事件流描述的是从页面中接收事件的顺序。IE的事件流是事件冒泡流,而Netscape的事件流是事件捕获流
张张
2019/12/26
9110
JavaScript停止冒泡和阻止浏览器默认行为
w3c的方法是e.stopPropagation(),IE则是使用e.cancelBubble = true
仙士可
2019/12/18
2.3K0
JavaScript事件详解
想必大家对JavaScript的事件都不陌生吧,大多数在网站开发的时候都会用到,这也是JavaScript的基本功之一,本文就为各位梳理一下相关知识。
用户8983410
2021/09/19
7290
相关推荐
javascript事件详解
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验