基于js中this和event 的区别(详解)
更新时间：2017年10月24日 08:45:36 作者：柠夏
下面小编就为大家带来一篇基于js中this和event 的区别(详解)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
今天在看javascript入门经典-事件一章中看到了 this 和 event 两种传参形式。因为作为一个初级的前端开发人员平时只用过 this传参，so很想弄清楚，this和event的区别是什么，什么情况下用什么比较合适。
onclick = changeImg(this) vs onclick = changeImg(event)
<img src='usa.gif' onclick="changeImg(event)" />
<script>
var myImages = [
'usa.gif'，'canada.gif','jamaica.gif','mexico.gif'
];
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 的区别(详解)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
在理解vue底层响应式原理时，了解到，原来对象中的属性，不单单从表面看起来那么简单是key:value形式，而是还有隐藏的内部特性，其中对象内的属性分为两种类型的属性：数据属性和访问器属性，本文将给大家详细介绍一下数据属性和访问器属性,需要的朋友可以参考下2023-05-05
下面小编就为大家分享一篇JavaScript 数组去重并统计重复元素出现的次数实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2017-12-12
这篇文章主要介绍了通过实例解析json与jsonp原理及使用方法,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-09-09
这篇文章主要介绍了JCrop+ajaxUpload 图像切割上传的实例代码的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下2016-07-07
本篇文章主要介绍了微信小程序模拟 cookie的实现，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-06-06
这篇文章主要给大家介绍了一个关于JS正则匹配的踩坑记录，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2021-04-04
在小程序中,有默认的图标icon组件,但你会发现它的图标样式很少,可能很多时候并不能满足我们的需求,所以这篇文章主要给大家介绍了关于微信小程序引入外部icon(阿里巴巴矢量图标)的相关资料,需要的朋友可以参考下2022-09-09
这篇文章主要介绍了js动态修改表格行colspan列跨度的方法,实例分析了javascript动态修改html中table属性的技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-03-03
浅析JavaScript中回调地狱与asyn函数和await函数原理
这篇文章主要介绍了JavaScript中回调地狱与asyn函数和await函数原理，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习吧2023-01-01
表达式加上参数g之后，表明可以进行全局匹配，注意这里可以的含义。2010-11-11
最新评论