那么他们两个是同时进行的吗?他们的顺序是先捕获
一个网页由三层构成(html 布局,js 行为,css 表示),一切的对象其实都成立在html上,html里面的dom供给了一些事件,然后通过js封装,我们可以用js去挪用dom上的事件。事件有很多,有我用过的有我没用过的,今天我想分析一番。
事件流我们都知道,有两种事件流,一个是冒泡一个是捕获。
捕获就是从body开始到你触发事件的节点,从外到内的一个过程。
冒泡呢,与之相反,从你触发的节点开始,一级一级往外,直到body,是一个从内到外的过程。
那么他们两个是同时进行的吗?他们的挨次是先捕获,再冒泡。
在addEventListener中addEventListener(event事件名称,function回调函数,是否在捕获或冒泡阶段执行)第三个参数可以转变事件触发时机。
事件东西 eventdiv.onclick=function(event){}这个里面的event就是事件东西,我这里说几个常用的。
event.preventDefault() //阻止默认事件,表单提交,a标签。 event.stopPropagation() //阻止通报下去,一帮用在一些自界说组件上,好比遮罩隐藏,在弹框上就要阻止通报了。 event.target //触发事件的元素,事件委托会用到。 事件名称下面我会把事件列举一下
通用事件
load 加载告成,window.load(function(){}),还有一个与之类似的DOMContentLoad当DOM加载完成之后触发。
unload 与之相反,卸载的时候
error 发送错误的时候,这个对照有意思。img触发error之后使用一张占位图。监听全局的错误提示,然后统计汇总,好比fundebug,也可以本身按照特性写一个针对公司项目的。
scroll 滚动的时候触发,无限滚动之类的一些效果
resize 放大缩小窗口的时候产生变革,和上面的scroll都需要注意去抖,
鼠标事件 传送门,去看鼠标事件
click 单击事件,在DOM上单击鼠标时候触发。用户在完成一次mousedown和mouseup之后触发click。触发挨次是:mousedown -> mouseup -> click。
mousedown和mouseup 鼠标按下和弹起,,使用频率不是很高。可以做一下拖动之类的效果。
mou搜索引擎优化ut和mou搜索引擎优化ver 鼠标移出和移入,使用起来会有冒泡的问题,可以使用延时的要领解决
mouseleave和mouseenter 鼠标移除和移除,解决了冒泡的问题。
mousemove 鼠标移动
键盘通用事件
keydown 按下键盘
keypress 中间的一个事件
keyup 抬起键盘
textInput 是对keypress的增补,用意是在将文本显示给用户之前更容易拦截文本。在文本插入文本框之前会触发textInput事件。
compositionstart 在IME的文本复合系统打开时触发,暗示要开始输入了。当你使用输入法的时候会触发一下
compositionupdate 在向输入字段中插入新字符时触发。
compositionend 在IME的文本复合系统封锁时触发,暗示返回正常键盘的输入状态。
控件事件
input 当内容产生转变的时触发,有可能是代码触发的窜改兼容ie的话input propertychange
change 当掉去焦点时,内容转变触发
blur 掉去焦点触发
focus 获得焦点触发
DOM改观事件
这类事件我没有用到过,前段时间在网上看到了一些,整合一下写写测试测试地点
DOMNodeInserted 插入节点时触发,appendChild这种
DOMNodeRemoved 移除节点时触发,removeChild
DOMSubtreeModified 产生变革最后会触发
DOMNodeInsertedIntoDocument
DOMAttrModified
DOMCharacterDataModified
触摸事件 移动端
touchstart 触摸
touchmove 触摸时移动
touchend 移开
手势 gesturestart - gesturechange - gestureend
温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/31275.html