当前位置:首页 > 日记 > 正文

基于js中this和event 的区别 | 详解

基于js中this和event 的区别 | 详解

今天在看javascript入门经典-事件一章中看到了 this 和 event 两种传参形式。因为作为一个初级的前端开发人员平时只用过 this传参,so很想弄清楚,this和event的区别是什么,什么情况下用什么比较合适。

onclick = changeImg(this)       vs     onclick = changeImg(event)

<img src='usa.webp' onclick="changeImg(event)" /><script>  var myImages = [    'usa.webp','canada.webp','jamaica.webp','mexico.webp'  ];  function changeImg(e) {    var el = e.target;    var newImgNumber = Math.round(Math.round()*3);    while(el.src.indexOf(myImages[newImgNumber]) != -1){      el.src =myImages[newImgNumber];    }  }</script>

1.this是Javascript语言的一个关键字。

2.this代表函数运行时,自动生成的一个内部对象,只能在函数内部使用。

3.this和event.target的区别:

js中事件是会冒泡的,所以this是可以变化的,但event.target不会变化(在事件触发时,只传递当前event对象的引用),它永远是直接接受事件的目标DOM元素;

另外,this和event.target都是dom对象,如果要使用jquey中的方法可以将他们转换为jquery对象:$(this)和$(event.target);

以上这篇基于js中this和event 的区别(详解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

相关文章

选择word文档内容的四种方法

选择word文档内容的四种方法

文档,方法,选择,四种,内容,  选择Word文档内容说白了就是选择文字,所以有很多人看了这个题目之后很不以为然,不就是选择文档吗?有什么大不了的,但是,你看完小编写的经验之后,再来进行评价。那么下面就由小编给大家分享选择word文档内容的技巧,…

Excel如何为不连续数据区域创建图

Excel如何为不连续数据区域创建图

区域,图表,数据,不连续,何为,  在Excel中,我们常常会根据现有的表格创建图表,以期达到更直观显示数据的目的。但并不是表格中所有的列都会需要显示在图表中的。以下是小编为您带来的关于Excel为不连续数据区域创建图表,希望对您有所帮助。Ex…

基于cookie实现zTree树刷新后展开

基于cookie实现zTree树刷新后展开

状态,刷新,电脑软件,cookie,zTree,基于cookie实现zTree树刷新后,展开状态不变。1、除了引用jQuery和zTree的JS外,引用cookie的JS:<script type="text/javascript" src="~/Scripts/jquery-treeview/lib/jquery.cookie.js"></script>2、JS代…

vue使用watch 观察路由变化,重新获

vue使用watch 观察路由变化,重新获

路由,内容,电脑软件,vue,watch,问题背景:点击用户头像 => 进入用户个人中心,在用户个人中心里点击其他用户的头像,我希望显示被点击用户的个人中心,但只看到了路由参数在发生变化,页面内容并没有更新。如图:页面代码如下:<script> export default…

PS绘制漂亮逼真的仿木纹台面教程

PS绘制漂亮逼真的仿木纹台面教程

教程,绘制,台面,逼真,木纹,版权申明:本文原创作者&ldquo;祁悠悠&rdquo;,感谢&ldquo;祁悠悠&rdquo;的原创经验分享!主要过程:12 3 阅读全文1 23 阅读全文教程结束,以上就是PS绘制漂亮逼真的仿木纹台面教程的全部内容,希望大家喜欢!相关教程推荐:PS…

PS合成创意有趣的草莓红铅笔

PS合成创意有趣的草莓红铅笔

创意,有趣,电脑软件,PS,这篇教程教的PS图片合成学习者们使用PS合成创意草莓铅笔,教程合成出来的图片效果非常有趣,也挺有创意的,方法很简单,推荐到,一起来学习吧!合成的流程大体如下:先铺好背景,把草莓与铅笔抠出后拖进来;调整铅笔笔头大小跟草莓大…

Photoshop滤镜制作砂土纹理

Photoshop滤镜制作砂土纹理

纹理,滤镜,砂土,电脑软件,Photoshop,今天为大家分享Photoshop制作砂土纹理方法,教程主要是通过纹理来实现的,推荐到,一起来学习吧!步骤:1、在ps软件中,前背景色为默认黑白,在滤镜中添加云彩,如图所示2、再一次在滤镜中添加分层云彩 如图所示3、接…

ps怎么合成秋季大片效果的女装全屏

ps怎么合成秋季大片效果的女装全屏

促销,全屏,秋季,海报,大片,今天我们就来看看使用ps合成一幅大片效果的秋季女装的促销海报,制作过程很简单,最终效果软件名称:Adobe PhotoShop7.0 简体中文版软件大小:154MB更新时间:2014-09-021、思路及前期策划。2、拍摄动作:根据策划案,然后去现…

怎样设置仿宋体显示为仿宋GB2312字

怎样设置仿宋体显示为仿宋GB2312字

仿宋体,显示,设置,字体,仿宋,  做好的Word文档在系统升级后,或更换电脑后,原来设置的字体突然都变了,排版效果全乱,找不出问题在哪,挨个修改,不甚其烦。那么下面就由小编给大家分享下word设置仿宋体显示为仿宋GB2312字体的技巧,希望能帮助到您。…

怎么使用Excel 2016表格对图表类型

怎么使用Excel 2016表格对图表类型

类型,图表,表格,电脑软件,Excel,  在Excel表格中,有时需要对新建图表的类型进行更改,比如将创建的柱形图更改为折线图。以下是小编为您带来的关于使用Excel 2016对图表类型进行更改,希望对您有所帮助。使用Excel 2016对图表类型进行更改操作…

ps怎么设计金属麦穗效果的图标?

ps怎么设计金属麦穗效果的图标?

图标,麦穗,效果,电脑软件,ps,很喜欢麦穗的的形状,寓意大麦比较好,想要绘制一个金色的麦穗,该怎么绘制呢?下面我们就来看看详细的教程。软件名称:Adobe Photoshop 8.0 中文完整绿色破解版软件大小:150.1MB更新时间:2015-11-041、先用钢笔工具把麦穗…

基于React实现表单数据的添加和删

基于React实现表单数据的添加和删

删除,表单,数据,详解,电脑软件,前言最近在学习React,做了一个简单的Demo,用以自勉及和有需要的朋友们参考学习。实现功能在输入框中输入数据后,点击保存按钮,数据将会逐一显示在输入框下方,点击保存后显示的任何一条数据,该数据即可被删除。实现…