事件用于处理网页中使用的行为语法:label.on事件类型=一段函数代码/函数名1,事件类型1,鼠标类型clickdblclickcontextmenumouseovermouseentermouseoutmouseleavemousedownmouseupmousemovemousewheel2,键盘类keydownkeyupkeypress3,表单类focusblurchangeinputsubmitsubmit事件source是Form标签,点击提交按钮时会触发4.窗口类loadscrollresize2.事件流概念:从事件触发到执行结束的整个过程有3个阶段:捕获阶段:处理过程从窗口向内寻找目标元素的过程目标阶段:找到目标元素后,执行其事件函数冒泡阶段:目标元素向外到窗口离开的过程注意:父标签的事件会在冒泡中执行子标签事件阶段3.事件监听器的概念:另一种事件绑定方法语法:label.addEventListener(event类型,事件函数,是否在捕获阶段执行)优点:当前事件可以在子标签事件的捕获阶段执行,标签可以绑定多个相同类型的事件,并启动事件一起分拆:什么是分拆?删除活动后为什么要解绑?因为绑定后事件会一直保存在内存中,如何解除绑定浪费的内存空间呢?事件绑定on事件类型,解绑方式:label.ontype=null事件监听器绑定事件,解绑方式:label.removeEventListener(eventtype,boundeventfunction)注意:当事件监听时,如果controller绑定的函数是一个匿名函数,它不能解除绑定。4.事件对象概念:在事件函数中,系统内置了一个对象,用于记录事件的所有信息。获取事件对象:label.ontype=function(e){e为事件对象}label.ontype=function(){window.event为事件对象}功能:获取鼠标按键代码-事件对象。button0表示左键;1表示滚轮;2表示右键获取事件类型——获取事件对象。类型键盘键码——事件对象。keyCode回车键:13空格键:32上、下、左、右:38403739组合键:返回一个布尔值,表示这些键是否与其他键组合使用Eventobject.shiftKeyeventObject.altKeyeventobject.ctrlKey获取鼠标位置相对于事件源的position事件对象.offsetX事件对象.offsetY是相对于当前浏览器可见窗口的事件对象.clientX事件对象.clientY是相对于整个网页文档的事件对象.pageXeventobject.pageY获取精准事件Target元素eventobject.target防止事件冒泡eventobject.stopPropagation()eventobject.cancelBubble=true防止默认行为eventobject.preventDefault()eventobject.returnValue=false4.事件委托概念:委托子标签事件到父标签处理原理:使用事件冒泡关键代码:获取准确的目标元素并进行判断好处:减少回流,减少绑定次数动态添加的子标签也可以有事件
