首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

浅谈JavaScript事件事件类型

Web浏览器能够发生事件有很多种类型,不同事件类型有不同事件信息。...DOM3级事件类型主要包括:UI事件,用户与页面上元素交互时触发;焦点事件,元素获得或失去焦点触发;鼠标事件,用户通过鼠标在页面上执行操作时触发;滚轮事件,使用鼠标滚轮时触发;文本事件,当在文档中输入文本时触发...1 var sc = document.createElement("script"); 2 sc.src="js/checkboxdemo.js"; 3...当用户在页面上由一个元素移动到另一个元素事件触发顺序为:focusout事件,在失去焦点元素上触发;focusin事件,在获得焦点元素上触发;blur事件,在失去焦点元素上触发;focus事件,...  复合事件是DOM3级中新增加一类事件,用于处理IME输入序列。

1.8K50

js事件

(); 7.JS类型:String,Number,Boolean,Null,Object,Function 8.JS字符型转换成数值型:parseInt(),parseFloat() 9.JS...中数字转换成字符型:(""+变量)10.JS取字符串长度是:(length) 11.JS字符与字符相连接使用+号. 12.JS比较操作符有:==等于,!...=不等于,>,>=,<.<= 13.JS中声明变量使用:var来进行声明 14.JS判断语句结构:if(condition){}else{} 15.JS循环结构:for([initial expression...HTML: 51.当超链和ONCLICK事件都有时,则老版本浏览器转向a.html,否则转向b.html.例:<a href="a.html" onclick......多重继续. 73.JSself指的是当前窗口 74.JS中状态栏显示内容:window.status="内容" 75.JStop指的是框架集中最顶层框架 76.JS中关闭当前窗口:

10.8K110
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    事件类型之鼠标事件

    事件类型之鼠标事件 常见事件类型 事件本质是程序各个组成部分之间一种通信方式,也是异步编程一种实现。...DOM 支持大量事件 鼠标事件 键盘事件 表单事件 窗口事件 焦点/剪贴板事件 网页状态事件 Touch事件 鼠标事件 鼠标事件指与鼠标相关事件,具体事件主要有以下一些。...mouseup:释放按下鼠标键时触发。 mousemove:当鼠标在一个节点内部移动时触发。当鼠标持续移动时,该事件会连续触发。...为了避免性能问题,建议对该事件监听函数做一些限定,比如限定一段时间内只能运行一次。...两者区别是,mouseenter事件只触发一次,而只要鼠标在节点内部移动,mouseover事件会在子节点上触发多次。

    2.5K30

    js动画事件_JavaScript事件

    js之动画事件 首先,动画事件主要包括以下三个animationstart,animationiteration和animationend事件,下面做简单分别介绍。...animation主要有6个属性,分别来设置动画呈现出来哦效果,这个在我另一篇文章中有介绍,我这边简单展示一下。...animation:name duration timing-function delay iteration-count direction; 分别是:动画名称 动画持续事件 动画运行速度曲线 动画开始时运行时间...下面一段代码讲述是采用监听动画开始,动画再次播放和动画结束做出相应改变,这里用到addEventListener监听动画开始、动画持续播放、动画结束播放。 <!...如发现本站有涉嫌侵权/违法违规内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

    18.4K10

    FlowableEngine支持事件类型

    如果events属性使用了不合法事件类型,或者使用了不合法throwEvent值,会在流程定义部署时抛出异常(导致部署失败)。...建议(但不强制)只分发CUSTOM类型FlowableEvents。使用RuntimeService分发事件: /** * 将给定事件分发给所有注册监听器。...* @throws FlowableIllegalArgumentException 当给定事件不可分发 */ void dispatchEvent(FlowableEvent event); 支持事件类型...下表列出引擎中所有事件类型。...其他引擎生成事件不会分发给这个监听器,而不论这些引擎是否运行在同一个JVM下。 某些事件类型(与实体相关)暴露了目标实体。按照事件类型不同,有些实体不能被更新(如实体删除事件实体)。

    1.5K30

    缺失遥测类型事件

    去年,云原生公司一群高级可观测性领导人开会时,我要求每个人告诉我他们最不喜欢遥测类型:指标、事件、日志、跟踪或其他。我非常确信主要答案会是日志。...没什么反对日志,但我最近听到这个组表达热门观点是“事件期间,如果查看了日志,就已经失败了”。 令我惊讶是,他们几乎一致地回答:事件事件是最不受欢迎遥测类型。我后续询问,你为什么这么不喜欢事件?...自那次会议以来,我们团队花了很多时间思考事件,研究如何使事件成为一流遥测类型。团队进行了广泛研究,着手构建跟踪变更事件功能。就在最近,我们宣布了在可观测性平台中接收事件能力。...下面是一些事件示例以及事件如何帮助排查问题: 系统变更:这些是大多数人在谈到事件时想到变更类型。示例可能是自动扩缩操作、配置变更或功能标志。...它也可能是一个新数据汇总规则生效,导致数据形状发生变更。 事件与其他遥测类型关系如何? 与可观测性信号一样,事件不能单独存在。事件在故障排除工作流中与指标、跟踪和日志发挥重要作用。

    7110

    Js 事件委托(事件代理)

    一、概述 事件委托,又叫事件代理。事件委托就是利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型所有事件。 例子:有三个同事预计会在周一收到快递。...这里其实还有2层意思: 第一,现在委托前台同事是可以代为签收,即程序中现有的dom节点是有事件; 第二,新员工也是可以被前台MM代为签收,即程序中新添加dom节点也是有事件。...二、为什么是使用事件委托 一般来说,dom需要有事件处理程序,我们都会直接给它设事件处理程序就好了,那如果是很多dom需要添加事件处理呢?...,这就是为什么性能优化主要思想之一就是减少DOM操作原因;如果要用事件委托,就会将所有的操作放到js程序里面,与dom操作就只需要交互一次,这样就能大大减少与dom交互次数,提高性能; 每个函数都是一个对象...三、事件委托原理 事件委托利用事件冒泡原理,将事件绑定到父级元素上,当点击子元素时,通过事件冒泡将事件传递到父级元素。  四、总结: 那什么样事件可以用事件委托,什么样事件不可以用呢?

    11.4K30

    js事件(event)

    什么是事件: 我们可以简单事件理解为浏览器感知系统。...,相当于文档中鼠标的坐标; target事件源;事件概念:事件最终发生在页面的那个元素上; 事件源和事件传播是息息相关 事件传播包括:冒泡和捕获;事件传播是浏览器在处理事件行为机制,冒泡阶段或者捕获阶段...注意:ie 678里,事件传播只有冒泡阶段; var target = e.target||e.srcElement 后者是处理ie兼容‘; div1.innerHTML="当前事件类型:”+e.type...;当你在一个form表单里点击提交按钮时网页会产生一个行为病刷新网页,当你网页上滚动鼠标滚轮时候,页面的滚动条会滚动等等;这些都叫事件默认行为,如果想把这些默认行为取消了,相应js代码如下: a.onclick...事件委托: 事件委托是利用事件传播机制,通过判断事件源来实现,是一种高性能事件处理方式。对事件委托好处和概念详见《高程3》第402页; 我们通过一个简单示例来看看事件好处。

    6.9K30

    js事件循环

    首先,我们来解释下事件循环是个什么东西: 就我们所知,浏览器js是单线程,也就是说,在同一时刻,最多也只有一个代码段在执行,可是浏览器又能很好处理异步请求,那么到底是为什么呢?...我们先来看一张图(这张图来自于http://www.zcfy.cc/article/node-js-at-scale-understanding-the-node-js-event-loop-risingstack...从上图我们可以看出,js主线程它是有一个执行栈,所有的js代码都会在执行栈里运行。...其实(正如上图所示),js是有两个任务队列,一个叫做Macrotask Queue(Task Queue),一个叫做Microtask Queue 前者主要是进行一些比较大型工作,常见有setTimeout...原因:因为一开始js主线程中跑任务就是macrotask任务,而根据事件循环流程,一次事件循环只会执行一个macrotask任务,因此,执行完主线程代码后,它就去从microtask队列里取队首任务来执行

    18.8K41

    js事件大全

    一般事件 事件 浏览器支持 描述 onClick IE3|N2|O3 鼠标点击事件,多用在某个对象控制范围内鼠标点击 onDblClick IE4|N4|O 鼠标双击事件 onMouseDown...onMouseMove IE4|N4|O 鼠标移动时触发事件 onMouseOut IE4|N3|O3 当鼠标离开某对象范围时触发事件 onKeyPress IE4|N4|O 当键盘上某个键被按下并且释放时触发事件...onMove IE|N4|O 浏览器窗口被移动时触发事件 onResize IE4|N4|O 当浏览器窗口大小被改变时触发事件 onScroll IE4|N|O 浏览器滚动条位置发生变化时触发事件...onStop IE5|N|O 浏览器停止按钮被按下时触发事件或者正在下载文件被中断 onUnload IE3|N2|O3 当前页面将被改变时触发事件 表单相关事件 事件 浏览器支持 描述...元素完成需要显示内容后触发事件 onStart IE4|N|O 当Marquee元素开始显示内容时触发事件 编辑事件 事件 浏览器支持 描述 onBeforeCopy IE5|N|O 当页面当前被选择内容将要复制到浏览者系统剪贴板前触发事件

    3.8K10

    JS 事件循环

    ,脚本执行,事件处理等 其包含线程有:GUI 渲染线程(负责渲染页面,解析 HTML,CSS 构成 DOM 树)、JS 引擎线程、事件触发线程、定时器触发线程、http 请求线程等主要线程 关于执行中线程...: 主线程:也就是 js 引擎执行线程,这个线程只有一个,页面渲染、函数处理都在这个主线程上执行。...工作线程:也称幕后线程,这个线程可能存在于浏览器或js引擎内,与主线程是分开,处理文件读取、网络请求等异步事件。...宏任务主要包含:script( 整体代码)、setTimeout、setInterval、I/O、UI 交互事件、setImmediate(Node.js 环境) 微任务主要包含:Promise、MutaionObserver...、process.nextTick(Node.js 环境) setTimeout/Promise 等API便是任务源,而进入任务队列是由他们指定具体执行任务。

    15.4K10

    js --- 事件

    1.事件流   事件发生时会在元素节点与根节点之间按照特定顺序传播,路径所经过所有节点都会收到该事件,这个传播过程即DOM事件流。...2.两种事件流模型   1.冒泡型事件流:事件传播是从最特定事件目标到最不特定事件目标。即从DOM树叶子到根   2.捕获型事件流:事件传播是从最不特定事件目标到最特定事件目标。...即从DOM树根到叶子 3.绑定事件方法   1.普通浏览器 绑定事件:addEventListener(type,name,bool);     删除事件:removeEventListener...()   2.ie 低版本 绑定事件:attachEvent()     删除事件:detachEvent() 4.参数说明 type 事件类型 例如:click load   name...事件执行函数   bool true 为事件捕获 && false 为事件冒泡 5.阻止事件冒泡和 事件捕获 1.阻止事件冒泡 不 阻止默认行为     event.stopPropagation

    7.6K30

    JS类型类型转换

    有不少人认为:JavaScript 没有类型! ? ? 正解是:JavaScript 中变量没有类型,但值有类型。变量可以随时持有任何类型值。 1. 值与类型 ?...使用 typeof 运算符即可查看值类型。 ? 特别注意:typeof null == "object",这已被设计和维护 JavaScript 委员会 T39 认定是一个错误。...类型转换基本规则 ? 在很多 JavaScript 书籍中强制类型转换被说成是危险、晦涩和糟糕设计。但对于不懂地方我们应该迎难而上,知其然并且知其所以然,不会因为种种传言就退避三舍。 ? ?...“隐式”强制类型转换 “隐式” 指那些隐晦、易坑人方式... a. 加法与字符串连接(+): 最权威解释,永远来自于规范 ? ? b. 宽松相等判定(==): 还是看规范中最权威解释 ? ?...下面以一道 JS 面试题 结束本文 题目: 实现一个函数,运算结果可以满足如下预期结果: add(1)(2) // 3 add(1, 2, 3)(10) // 16 add(1)(2)(3)(4)(5)

    7.7K40

    js 事件笔记

    DOCTYPE html> JS Bin .box1{ border:...3.2 addEventListener使用 addEventListener有三个参数 事件类型 事件处理方法 布尔参数,如果是true表示在捕获阶段调用事件处理程序,如果是false,则是在事件冒泡阶段处理...1、事件对象来源 在触发DOM上某个事件时候会产生一个事件对象event,这个对象包含着所有与事件有关信息,包括产生事件元素、事件类型等相关信息。...2、event常见属性 event对象包含与创建它特定事件有关属性和方法,触发事件类型不同,可用属性和方法也不同,但是所有事件都会包含 ?...六、常见事件类型 常见事件类型 解析 click 单击 dblclick 双击 focus 焦点,比如表单input把光标放上去开始输入时刻 blur 失去焦点,比如输入完成切换到下一个输入框时,就失去了焦点

    11.1K21

    JS事件

    想要知道这些事件是在什么时候进行调用,就需要了解一下“事件流”概念。 事件事件流描述就是从页面中接收事件顺序。...而早期IE和Netscape提出了完全相反事件流概念,IE事件流是事件冒泡,而Netscape事件流就是事件捕获。...绑定方式有如下两种 行内绑定(内联模型): 通过在JS中选中某个节点,然后给节点添加onclick属性 "btnClick()">按钮 function btnClick(){...console.log("hello"); } script> 复制代码 动态脚本: 通过在JS中选中某个节点,然后给节点添加onclick属性 "btn">按钮 var btn =...要创建自定义事件可以由createEvent("CustomEvent"); 返回对象有一个initCustomEvent()方法接收如下四个参数。 type:字符串,触发事件类型,自定义。

    8.3K20

    js鼠标事件

    页面加载事件(onload),鼠标双击事件(ondbclick) window.onload=function(){                 //绑定元素,执行对应事件 鼠标双击(ondblclick...(){                     alert('我是双击显示');                 }             } 鼠标摁下(onmousedown)事件(摁下就执行,鼠标无需抬起...                document.getElementById('d4').onmouseup=function(){                     alert('鼠标抬起提示...(){                     alert('鼠标移动提示');                 }             } 鼠标移入(onmouseover)事件             ...,移入事件需要移入到指定对象内才执行事件

    18.2K40

    js事件基础

    所以存在兼容性问题。 事件冒泡 事件冒泡就是当事件对象有父子级关系时,当执行子级事件后,父级事件也会因为事件冒泡,也会执行,因此,大多数时候,事件冒泡需要消除。...在火狐或者谷歌浏览器下,使用事件方法是将函数中传进来e; 而在IE浏览器下,使用事件不需要传进e,直接使用event。...所以为了避免事件兼容性问题 var oEvent = e || event; 一般使用这样方法来消除浏览器对事件兼容 鼠标点击事件 鼠标的位置 oevent.clientX:返回鼠标的横坐标的位置...^ _ ^ ) 小案例——自定义右菜单 1.实现点击鼠标右键弹出自己菜单 2.实现点击空白时,菜单消失 3.实现点击菜单时,菜单不会消失(事件冒泡) <!...:animate.js 代码如下 <!

    3.2K10
    领券