js的事件

news/2024/4/28 15:29:50/文章来源:https://blog.csdn.net/xiaohua0708day/article/details/137089283

JS的事件介绍
JS(JavaScript)是基于对象(Object-based)、事件驱动的脚本语言。

JS事件,就是用户或浏览器本身的某种行为,一般是用户对页面的一些动作引起的,例如,单击某个链接或按钮、在文本框中输入文本、按下键盘上的某个按键、移动鼠标等等。当事件发生时,您可以使用 JavaScript 中的事件处理程序(也可称为事件监听器)来检测并执行某些特定的程序。JS(JavaScript)与HTML 之间的交互是通过事件(event)实现的,或者说,事件是JavaScript和DOM之间进行交互的桥梁。

一般情况下事件的名称都是以单词on开头的,例如点击事件 onclick、页面加载事件 onload 等。

JavaScript常见的事件大体分类及常用事件:

1)鼠标事件

事件         说明

onclick     //鼠标单击事件onmouseover   //鼠标移入事件onmouseout    //鼠标移出事件onmousedown     //鼠标按下事件onmouseup     //鼠标松开事件onmousemove        //鼠标移动事件

2)键盘事件

onkeydown       //键盘按下onkeyup         //键盘松开

3)表单事件

onfocus         //获取焦点时触发onblur          //失去焦点时触发onselect        //选中“单行文本框”或“多行文本框”中的内容时onselectstart   //开始一个新的选择时onchange        //具有多个选项的表单元素选择某一项时触发

4)编辑事件

oncopy          //复制(拷贝)时触发onselect       // 页面内容被选取时触发oncontextmenu   //按下鼠标右键时触发

5)页面事件

onload           //文档加载完成后触发onbeforeunload    //离开页面之前触发

JS的事件的处理及结果同浏览器的环境都有很大的关系,浏览器的版本越新,支持事件就越多,支持的也越完善。【HTML DOM 事件https://www.w3schools.cn/jsref/dom_obj_event.html】

事件调用通常是通过操作HTML属性的方式来实现的,可称为“事件处理器”(event handler)方式,又分为两种:在script标签中调用事件和在元素中调用事件。还有另外一种添加事件的方式,可称为“事件监听器”(event listener)方式,使用addEventListener() 和 removeEventListener()方法。

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

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

相关文章

http模块—http请求练习

题目要求:搭建如下http服务: 1.当浏览器向我们的服务器发送请求时,当请求类型是get请求,请求的url路径地址是/login。响应体结果是登录页面 2.当浏览器向我们的服务器发送请求时,当请求类型是get请求,请求…

ubuntu 首次登录mysql8 未设置密码或忘记密码解决方法 亲测可用

-1.首先输入以下指令: sudo cat /etc/mysql/debian.cnf2. 再输入以下指令: mysql -u debian-sys-maint -p //注意! //这条指令的密码输入是输入第一条指令获得的信息中的 password ZCt7QB7d8O3rFKQZ 得来。 //请根据自己的实际情况填写!运…

QT文件读写操作和内容提取

访问IO设备,需要先调用open()来设置正确的OpenMode(例如ReadOnly或ReadWrite) 打开设备后后,使用write() 或putChar() 写入数据到文件和设备,并通过调用read(),readLine() 或readAll() 进行读取;使用完设备后&#xf…

离线数仓(八)【DWD 层开发】

前言 1、DWD 层开发 DWD层设计要点: (1)DWD层的设计依据是维度建模理论(主体是事务型事实表(选择业务过程 -> 声明粒度 -> 确定维度 -> 确定事实),另外两种周期型快照事实表和累积型…

【自我提升】一、Hyperledger Fabric 概念梳理

写在前面:最近因为业务需要,开始学习Hyperledger Fabric了,做java全栈工程师可真难搞。现在算是啥类型的都在涉及了,现在这个技术啥都不懂,就先开个学习专栏,记录记录。顺带也给各位道友参考参考。 目录 …

【Bug】记录2024年遇到的Bug以及修复方案

--------------------------------------------------------分割线 2024.3.22------------------------------------------------------- 1、load_sample_image raise AttributeError(“Cannot find sample image: %s” % image_name) AttributeError: Cannot find sample imag…

[linux初阶][vim-gcc-gdb] OneCharter: vim编辑器

一.vim编辑器基础 目录 一.vim编辑器基础 ①.vim的语法 ②vim的三种模式 ③三种模式的基本切换 ④各个模式下的一些操作 二.配置vim环境 ①手动配置(不推荐) ②自动配置(推荐) vim是vi的升级版,包含了更加丰富的功能. ①.vim的语法 vim [文件名] ②vim的三种模式 命令…

WPF —— DockPanel、ProgressBar 控件详解

ProgressBar 控件详解 1Progress bar简介 ProgressBar:进度条控件。 WPF带有一个方便的控件用于显示进度,称ProgressBar。它的工作原理就是设置最小值和最大值然后通过递增一个值,这样就可以直观的显示当前进度情况。 2 Progress bar常用的…

DFS:从递归去理解深度优先搜索

一、深入理解递归 二、递归vs迭代 三、深入理解搜索、回溯和剪枝 四、汉诺塔问题 . - 力扣&#xff08;LeetCode&#xff09; class Solution { public: //笔试题&#xff0c;不讲武德&#xff0c;CAvoid move(int n,vector<int>& A, vector<int>& B, ve…

前端实现浏览器自定义滚动条

前言&#xff1a; 最近有个项目&#xff0c;产品觉得浏览器默认滚动条太丑了。想美化一下&#xff0c;比如自定义颜色&#xff0c;加上圆角&#xff0c;宽高都要更改一下。我查了资料和文档总结了一下 写法&#xff0c;特此记录以便之后使用。 浏览器滚动条api 总结&#xff…

【爬取网易财经文章】

引言 在信息爆炸的时代&#xff0c;获取实时的财经资讯对于投资者和金融从业者来说至关重要。然而&#xff0c;手动浏览网页收集财经文章耗时费力&#xff0c;为了解决这一问题&#xff0c;本文将介绍如何使用Python编写一个爬虫程序来自动爬取网易财经下关于财经的文章 1. 爬…

代码随想录 Day-25

力扣题目 509.斐波那契数 思路 很理所当然的&#xff0c;可以使用递归的方式其次是用动态规划的方式&#xff0c;动态规划的核心就是递推公式。 那么递推和递归一字之差&#xff0c;有什么区别呢&#xff1f;&#xff08;递推和递归的区别&#xff09; 1、递归 class Solutio…

Java项目:77 springboot母婴商城

作者主页&#xff1a;源码空间codegym 简介&#xff1a;Java领域优质创作者、Java项目、学习资料、技术互助 文中获取源码 项目介绍 本课题后端使用SpringBoot Spring Cloud框架&#xff0c;前端采用html&#xff0c;JQuery&#xff0c;JS&#xff0c;DIVCSS技术进行编程&…

Redis中AOF文件重写与同步

AOF文件的写入与同步 Redis服务器进程就是一个时间循环(loop),这个循环中的文件时间负责接收客户端的命令请求&#xff0c;以及向客户端发送命令回复&#xff0c;而时间事件则负责执行像serverCron函数这样需要定时运行的函数。因为服务器在处理文件事件时可能会执行些命令&am…

【Java程序设计】【C00416】基于(JavaWeb)Springboot的客户管理系统(含论文)

基于&#xff08;JavaWeb&#xff09;Springboot的客户管理系统&#xff08;含论文&#xff09; 项目简介项目获取开发环境项目技术运行截图 博主介绍&#xff1a;java高级开发&#xff0c;从事互联网行业六年&#xff0c;已经做了六年的毕业设计程序开发&#xff0c;开发过上千…

C# 文件操作

文章目录 C# 文件操作创建文件运行结果 写入文件程序文件运行结果 WriteAllLines-写入多行运行结果 追加字符串运行结果追加多行字符串 读取文件ReadAllText运行结果 ReadAllLines-用数组接收读取的内容运行结果 采用流&#xff08;Stream&#xff09;的方式来读取内容运行结果…

stm32平衡车

目录 一.所需材料 二.PID算法&#xff08;简单说明&#xff09; 直立环 速度环 串级PID 三.使用到的外设 1.定时器输出比较-PWM 2.定时器编码器模式 3.编码器读取速度 4.电机驱动函数 5.外部中断 四、小车 调试 一.所需材料 1.陀螺仪MPU6050--读取三轴的加速度…

C++:梦的开始——创建第一个hello world(1)

我这里使用的编写代码的工具是Start Experimental Instance of Visual Studio 2022 你可以去微软的官网上寻找&#xff0c;并且安装 部署项目 项目就是一个文件夹&#xff0c;他将我们的数据都放到了里面&#xff0c;这就是一个项目 在Visual Studio 2022中 选择c 的空项目&a…

【Linux 08】进程概念

文章目录 &#x1f308; 01. 基本概念&#x1f308; 02. 描述进程 PCB&#x1f308; 03. 使用 ./ 的方式创建进程&#x1f308; 04. ps 查看进程&#x1f308; 05. getpid / getppid 获取进程标识符&#x1f308; 06. kill 终止指定进程&#x1f308; 07. fork 创建子进程&…

python学习14:python中的表达式

python中的表达式 1.表达式是什么呢&#xff1f; 表达式就是一个具有明确结果的代码语句&#xff0c;如11、type(‘字符串’)、3*5等 在定义变量的时候&#xff0c;如age108,等号右侧的就是表达式&#xff0c;也就是有具体的结果&#xff0c;将结果赋值给了等号左侧的变量 2.…