事件高级部分

一,注册事件

即给元素添加事件

1.传统注册方式

2.方法监听注册方式

事件类型:字符串形式,不用带on

可以给一个元素添加多个程序

二.删除事件

1.方式

参数见上文

三.DOM事件流

事件的传播过程叫做事件流

js代码只能获取一个阶段:捕获或冒泡

 onclick或attachEvent只能得到冒泡阶段

捕获阶段:先从父级到子级,监听注册:第三个参数为true。会先弹出父级在弹出子级

冒泡阶段:监听注册:第三个参数为false或省略,从子级到父级,会先弹出子级的再弹出父级的

比起捕获我们更关心冒泡

四,事件对象

event就是事件,写在侦听事件的小括号里面

div.οnclick=function(event){}

常见的属性和方法

2,阻止默认行为

让链接不跳转,或按提交按钮不提交

除了上图的那一个,用return false也可以,缺点是:return后面的代码就不执行了

五,阻止冒泡

1,阻止冒泡的两种方式

兼容性的解决方案:
 

六,事件委托

1,原理

不是每个子节点单独设置事件监听器,而是监听器设置在其父节点上,然后利用冒泡原理影响设置每个子节点。

好处:只用操作一次DOM,提高了性能

七,常见的鼠标事件

1.禁止鼠标右键菜单

2.禁止鼠标选中

3.鼠标事件对象

可视页面:就可看见的那一部分,控制面板上面

文档页面:是整体的部分,是有滚动条的

八,常见的键盘事件

同时写先执行down-press-up

1.键盘事件对象

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

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

相关文章

【考研数学】汤家凤“免单“数学题被吐槽‘太难’,老汤回应「怎么还有脸笑」,网友:这些题有毒!

我看了汤家凤老师出的几道题,实际上对于考研的同学来说,确实是送分题 第一个是三角函数变换中的万能公式;第二个e^x的泰勒展开公式;第三个是第一类重要极限。只要复习过,那基本上都能正常做出来。 至于汤家凤老师说「…

STM32快速入门(总线协议之I2C一主多从(软件实现 硬件实现))

STM32快速入门(总线协议之I2C一主多从(软件实现 & 硬件实现)) 前言 支持一对多(一主多从)、多对多传输(多主多从),只支持半双工,一般有两根数据线&…

C++笔记(体系结构与内核分析)

1.OOP面向对象编程 vs. GP泛型编程 OOP将data和method放在一起,目的是通过封装、继承、多态提高软件的可维护性和可扩展性GP将data和method分开,可以将任何容器与任何算法结合使用,只要容器满足塞饭所需的迭代器类型 2.算法与仿函数的区别 …

OGG几何内核-网格化的改进

OGG社区于4月19日发布了OGG 1.0 preview版本。相对于OCCT 7.7.0有很多改进,目前在持续研究中。最近测试了一下网格化,确实有很好的改进。对比展示如下: 几何内核: OGG 1.0 preview 几何内核:OCCT 7.7.0 采用OCCT几何内…

IT项目管理-小题计算【太原理工大学】

1.合同总价问题 问承包商的利润是? 实际利润目标利润(目标成本-实际成本)*卖方分担比例 解:10 000(100 000 - 90 000)* 0.2 12 000(元) 实际成本有时也写作最终成本,问承…

cmu15445 2023fall project3 详细过程(下)QUERY EXECUTION

QUERY EXECUTION task3/task4 Task #3 - HashJoin Executor and Optimization1、HashJoin1.1 思路1.2 代码 2 NestedLoopJoin优化为HashJoin2.1 思路2.2 代码 Task #4 Sort Limit Executors Top-N Optimization Window Functions1、Sort1.1 思路1.2 代码 2、Limit Executors2…

Linux与Windows互传文件【笔记】

Linux与Windows互传文件【笔记】 前言前言推荐Linux与Windows互传文件首先确保Windows安装ssh如何传送文件问题 最后 前言 这是陈旧已久的草稿2023-05-10 00:01:24 这个是准备把计组课程华为智能计组的,传输文件。 最后发现,好像没有实现了。 现在202…

Java 守护线程 ( Daemon Thread )详解

在Java中,线程分为两类:用户线程(User Thread)和守护线程(Daemon Thread)。守护线程是后台线程,主要服务于用户线程,当所有的用户线程结束时,守护线程也会自动结束,JVM会随之退出。守护线程的一个典型例子是…

pikachu靶场(xss通关教程)

(注:若复制注入代码攻击无效,请手动输入注入语句,在英文输入法下) 反射型xss(get型) 1.打开网站 发现有个框,然后我们在框中输入一个“1”进行测试, 可以看到提交的数据在url处有显示&#xf…

AI跟踪报道第41期-新加坡内哥谈技术-本周AI新闻:本周Al新闻: 准备好了吗?事情即将変得瘋狂

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗?订阅我们的简报,深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同,从行业内部的深度分析和实用指南中受益。不要错过这个机会,成为AI领…

Oracle 删除表中的列

Oracle 删除表中的列 CONN SCOTT/TIGER DROP TABLE T1; create table t1 as select * from emp; insert into t1 select * from t1; / / --到6000行,构造一个实验用大表T1。 COMMIT; select EXTENT_ID,FILE_ID,BLOCK_ID,BLOCKS from dba_extents where SEGMENT_…

【Qt 学习笔记】Qt常用控件 | 布局管理器 | 水平布局Horizontal Layout

博客主页:Duck Bro 博客主页系列专栏:Qt 专栏关注博主,后期持续更新系列文章如果有错误感谢请大家批评指出,及时修改感谢大家点赞👍收藏⭐评论✍ Qt常用控件 | 布局管理器 | 水平布局Horizontal Layout 文章编号&…

异常处理/CC++ 中 assert 断言 应用实践和注意事项

文章目录 概述assert 本质浅析Release版本下的assert是否生效默认设置下 QtCreator环境 assert 过程默认配置下 VS环境 assert 过程配置VS发布模式下的断言生效VS环境Release版本的UI程序Release下请当我不生效 请勿滥用assert导致逻辑错误再强调不要在assert内执行逻辑功能怎敢…

react18【系列实用教程】useContext —— Context 机制实现越层组件传值 (2024最新版)

什么是 Context 机制? Context 机制是 react 实现外层组件向内层组件传值的一种方案,父组件可以向其内部的任一组件传值,无论是子组件还是孙组件或更深层次的组件。 实现步骤 1.使用createContext方法创建一个上下文对象 Ctx 2.在顶层组件中通…

轮转数组 与 消失的数字

轮转数组 思路一 创建一个新内存空间,将需轮转的数依次放入,之后在把其它数放入 代码: void rotate(int* nums, int numsSize, int k) {k k % numsSize;// 确定有效的旋转次数if(k 0)return;int* newnums (int*)malloc(sizeof(int) * nu…

An 2024下载

An2024下载: 百度网盘下载https://pan.baidu.com/s/1cQQCFL16OUY1G6uQWgDbSg?pwdSIMS Adobe Animate 2024,作为Flash技术的进化顶点,是Adobe匠心打造的动画与交互内容创作的旗舰软件。这款工具赋予设计师与开发者前所未有的创意自由&#x…

设计模式-结构型-桥接模式-Bridge

桥接模式可以减少类的创建 矩阵类 public class Matrix {private String fileName;public Matrix(String fileName) {this.fileName fileName;}public String getFileName() {return fileName;} } 图片抽象类 public abstract class Image {protected ImageImp imp;public …

vivado Kintex UltraScale 配置存储器器件

Kintex UltraScale 配置存储器器件 下表所示闪存器件支持通过 Vivado 软件对 Kintex UltraScale 器件执行擦除、空白检查、编程和验证等配置操作。 本附录中的表格所列赛灵思系列非易失性存储器将不断保持更新 , 并支持通过 Vivado 软件对其中所列非易失性存…

深入解析MySQL中的事务(下)

MySQL事务管理 3. 隔离性(Isolation)查看和设置隔离级别隔离级别作用域区别与解析 四种隔离级别解析小结 4. 一致性(Consistency)如何保持一致性 5.“保持原子性、隔离性、持久性就能保证一致性”的理解: 四、如何理解…

图论专题训练

leecode 547 并查集 class Solution { public:int findCircleNum(vector<vector<int>>& isConnected) {ini();int len isConnected.size();for(int i0;i<len;i){for(int j0;j<len;j)if(isConnected[i][j]){unio(i,j);}}int ans 0;for(int i0;i<len;…