【JS】事件绑定方法自带一个形参e“function(e)”,what is e?

在学习js的时候 我跳过了一部分章节的内容,导致现在学习react的时候很多内容都不知所措,因为这些教程都是建立在它认为你js所有内容都掌握的前提下,当然这是我自身的原因。需要反省。
 

下面是正题:

我们知道js有很多事件,事件说白了就是 鼠标点击,鼠标移动 ,键盘打字什么的这些人为的操作。

function(e) 其中的e ,如果你单单写一个方法,比如

那么e其实就是一个形参,和你放入ABCDEFG这些,并没有什么不同,其实我感觉大部分人都迷在这里了,e到底是个什么东西!为什么那里面不写其他字母,其实想明白就好了

重点来了:
当某个元素具有 某个事件处理的时候(比如鼠标点击),那么这个e就不仅仅只是一个参数了,它代表着捕获的这个事件对象,很抽象,别急,我们看个例子:

一个很简单的页面效果,就一个div里 包含一个点击事件,点击事件触发会在控制台打印出 event这个参数,注意!!

下面我将用费曼学习法来讲述一下:
        为什么是event,因为这里面你可以随便放任意值,你说你不喜欢e这个字母,看见就恶心,你可以放ZXCVB任何你喜欢的字母和单词,只不过这是这么些年来人们潜移默化的约定罢了,就像for循环函数,为什么是i++,因为仅仅是人们习惯了,一看到就知道哦,这个i是要用来循环的,就像看见这个e,哦,它是用来代表事件对象的,别人看你的代码会一下子就知道这是什么意思。

        它仅仅代表了它监听到的这个{事件对象},这个对象在代码里代表着谁呢? 没错,就是onclick,说人话就是 监听到了 鼠标 这个事件对象。

说白了也就是浏览器这个对象自带的一个对象,这个对象里包含了许多属性和方法,就好比document 一样,自带了很多方法(getElementTagName方法之类的)如下面图:

        常用的e.target, 其实就相当于 上面例子里的div

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/411214.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Linux设备模型(五) - uevent kernel实现

1. Uevent的功能 Uevent是Kobject的一部分,用于在Kobject状态发生改变时,例如增加、移除等,通知用户空间程序。用户空间程序收到这样的事件后,会做相应的处理。 该机制通常是用来支持热拔插设备的,例如U盘插入后&…

mac flutter 配置

下载Flutter Sdk Start building Flutter Android apps on macOS - Flutter 中文文档 - Flutter 中文开发者网站 - Flutter 下载后解压放到一个文件夹 /Users/zhiyu/Documents/gitflutter/flutter3.19.1/ 环境变量中要用到 配置 Android 开发 下载 Android Studio 和应用工具…

软件运维维保服务方案-套用模板

软件运维维保方案-套用模板 项目情况 1.1 项目背景简述项目的来源、目的和重要性。说明项目的规模、预算和预期目标。 1.2 项目现状分析当前系统/软件的运行状态、存在的问题和潜在风险。提供最近一次的维护报告或相关统计数据。服务简述 2.1 服务内容明确运维服务的具体内容&…

三、系统知识笔记-计算机系统基础知识

一、计算机系统概述 计算机系统是指用于数据管理的计算机硬件、软件及网络组成的系统。 它是按人的要求接收和存储信息,自动进行数据处理和计算,并输出结果信息的机器系统。 冯诺依曼体系计算机结构: 1.1计算机硬件组成 冯诺依曼计算机结…

大模型实战营第二期——4. XTuner 大模型单卡低成本微调实战

github地址:InternLM/tutorial-书生浦语大模型实战营文档地址:XTuner 大模型单卡低成本微调实战视频地址:XTuner 大模型单卡低成本微调实战Intern Studio: https://studio.intern-ai.org.cn/console/instance 这个人的研究方向是眼科的AI&am…

分披萨 - 华为OD统一考试(C卷)

OD统一考试(C卷) 分值: 100分 题解: Java / Python / C 题目描述 “吃货”和“馋嘴”两人到披萨店点了一份铁盘(圆形)披萨,并嘱咐店员将披萨按放射状切成大小相同的偶数个小块。 但是粗心服务员将披萨切成了每块大小…

matlab 线性四分之一车体模型

1、内容简介 略 57-可以交流、咨询、答疑 路面采用公式积分来获得,计算了车体位移、非悬架位移、动载荷等参数 2、内容说明 略 3、仿真分析 略 线性四分之一车体模型_哔哩哔哩_bilibili 4、参考论文 略

Kubernetes基础(二十五)-Kubernetes GC原理

1 K8s 的垃圾回收策略 当给k8s一个资源对象设置OwnerReference的时候,删除该资源对象的owner, 该对象也会被连带删除。这个时候用的就是k8s的垃圾回收机制。 k8s目前支持三种回收策略: 1)前台级联删除(Foreground Cascading De…

中英文互译赫尔辛基大学翻译模型安装与测试

引子 近期接到一个文本中英互译的任务,一直以为这种翻译应该很成熟,各种商用版本很多。那么开源的一定也不少,经过网络搜索发现,近两年还真的出现了很多优秀的开源翻译项目。找到了赫尔辛基大学开源免费的多语言翻译模型&#xff…

202432读书笔记|《泰戈尔的诗》——什么事让你大笑,我生命的小蓓蕾

202432读书笔记|《泰戈尔的诗》——什么事让你大笑,我生命的小蓓蕾 《泰戈尔写给孩子的诗(中英双语版)》作者拉宾德拉纳特泰戈尔文 张王哲图,图文并茂的一本书,文字与图画都很美,相得益彰!很值得…

使用mimikata获取域控权限(无免杀)

一、实验环境 windows 7 ip:192.168.1.3 (域内普通用户,有本地管理员权限,但不知明文密码) windows server 2012 ip:192.168.1.1 (DC域控,与server2012管理员密码相同,但不知明文密码)二、准备工作 1、使…

java spring 01 IOC源码

01.spring 中的基础是IOC 中有一个方法 例子: 01. 02. 03. 这里是扩展方法,现在是空的 beanfactorypostprocessors: 国际化:(一般不管) 广播器: 监听器: 实例化&#xff1…

「哈哥赠书活动 - 48期」-『商业分析思维与实践:用数据分析解决商业问题宣传文案』

⭐️ 赠书 - 《商业分析思维与实践》 ⭐️ 内容简介 本书以业务为导向,详细地讲解了如何通过大数据分析来解决商业问题。其目的在于运用大数据分析思维,帮助读者把学术知识应用于真实的业务场景,解决实际的业务问题。本书基于业务问题&#x…

nginx之状态页 日志分割 自定义图表 证书

5.1 网页的状态页 基于nginx 模块 ngx_http_stub_status_module 实现,在编译安装nginx的时候需要添加编译参数 --with-http_stub_status_module,否则配置完成之后监测会是提示语法错误注意: 状态页显示的是整个服务器的状态,而非虚拟主机的状态 server{…

LeetCode 热题 100 | 二叉树(四)

目录 1 114. 二叉树展开为链表 2 105. 从前序与中序遍历序列构造二叉树 3 437. 路径总和 III 菜鸟做题(即将返校版),语言是 C 1 114. 二叉树展开为链表 题眼:展开后的单链表应该与二叉树 先序遍历 顺序相同。 而先序遍历就…

9002-29-3,D-85大孔丙酸烯系弱酸性阳离子交换树脂,在水或极性溶剂中能溶胀

您好,欢迎来到新研之家 文章关键词:9002-29-3,D-85大孔丙酸烯系弱酸性阳离子交换树脂,阳离子交换树脂,阳离子交换树脂IRC-50 一、基本信息 【产品简介】:Cation exchange resin is a special type of re…

Linux信号详解

文章目录 一、Linux信号1. 信号的概念2. 信号的定义3. 系统定义的信号 二、信号产生的方式1.通过键盘产生2. 通过系统调用3. 软件条件4. 硬件异常 三、信号处理函数1. OS发送信号的实质2. 指令发送信号3. signal()4. sigaction() 四、信号屏蔽机制1. 信号处理方式2.信号集操作函…

python学习26

前言:相信看到这篇文章的小伙伴都或多或少有一些编程基础,懂得一些linux的基本命令了吧,本篇文章将带领大家服务器如何部署一个使用django框架开发的一个网站进行云服务器端的部署。 文章使用到的的工具 Python:一种编程语言&…

数字化转型导师坚鹏:政府数字化转型智慧城市类案例研究

政府数字化转型智慧城市类案例研究 课程背景: 很多地方政府存在以下问题: 不清楚政府数字化转型的智慧城市类成功案例 不清楚政府数字化转型的城市大脑类成功案例 不清楚政府数字化转型的综合实践类成功案例 课程特色: 针对性强 …

【uniapp】uniapp开发的微信公众号,微信设置字体大小或者关怀模式,页面布局字体大小不受影响的解决方法:

文章目录 一、问题及效果:二、解决: 一、问题及效果: 二、解决: 在uniapp的app.vue的script标签内添加以下代码: (function(){//安卓端function handleFontSize () {// 设置网页字体为默认大小WeixinJSBridge.invoke…