1.什么是事件?
HTML 事件是发生在 HTML 元素上的事情。
当在 HTML 页面中使用 JavaScript 时, JavaScript 可以触发这些事件。
简单的说就是 js和html之间交互的触发点。
2.事件流
事件的流向
事件冒泡
事件捕获
3. 事件的分类
窗口
焦点
鼠标
键盘
oninput 兼容高级浏览器
4. 事件对象
oDiv.onclick=function(ev){ev 高级浏览器
window.event 兼容的非火狐
var oEvent=ev||event;
var ev=ev||event
var ev=arguments[0]||event;
}
储存事件详细信息的对象
位置
ev.clientX
ev.clientY 可视区
ev.pageX
ev.pageY 页面document
ev.offsetX
ev.offsetY 点击的位置到边缘的距离
键码
ev.keyCode
ev.ctrlKey
取消冒泡
ev.cancelBubble=true 都兼容
ev.stopPropagation() 高级浏览器 阻止传播
if(ev.stopPropagation){
ev.stopPropagation()
}else{
ev.cancelBubble=true
}
5. 浏览器默认行为
return false
在事件绑定中不好用
ev.preventDefault() 高级浏览器
ev.returnValue=false 兼容IE
if(ev.preventDefault){
ev.preventDefault()
}else{
ev.returnValue=false
}
6.事件源
ev.target 高级浏览器
ev.srcElement 非火狐
7.事件委托
给一个未来的不存在的元素加事件
给一堆相同的元素加相同的事件
给父级加事件,触发的时候找事件源,核心利用的原理是事件冒泡