事件
鼠标事件：
事件名称 场景应用
onmousedown 当鼠标被按下的时候触发
onmouseup 当鼠标抬起的时候触发
onmouseover 当鼠标移入的时候触发
onmouseout 当鼠标移出的时候触发
onclick 当鼠标点击的时候触发
ondblclick 当鼠标双击的时候触发
onmousemove 当鼠标移动的时候触发
oncontextmenu 当鼠标右键的时候触发（可以自定义右键菜单）
鼠标移入移出变色
鼠标双击、鼠标移动、鼠标右键
键盘事件
事件名称 场景应用
onkeydown 当键盘（按键）被按下的时候触发
onkeyup 当键盘（按键）被抬起的时候触发
键盘事件与keycode使用
表单事件
onsubmit 当表单提交的时候触发
表单事件Demo
onchange 当表单内容改变的时候就会触发改变
onchange应用
onfocus 获取焦点时会触发
onblur 失去焦点时会触发
onfocus和onblur以及onsubmit应用
窗口事件
和窗口有关的事件 window 是js中最顶层的对象
onload 当窗口加载完成时触发
onresize 当窗口改变时触发
窗口事件示例
事件对象 event
事件对象就是当事件发生时，用来记录事件的相关信息的对象
事件对象理解为：飞机的黑匣子或者行车记录仪
兼容性解决方案：var ev=evt ||event
event兼容性解决方案：传入的evt也可以是ev
clientX 事件属性返回当事件被触发时鼠标指针向对于浏览器页面（或客户区）的水平坐标。
客户区指的是当前窗口
语法：event.clientX
clientY 事件属性返回当事件被触发时鼠标指针向对于浏览器页面（客户区）的垂直坐标。 客户区指的是当前窗口。
语法：event.clientY
clientX和clientY事件
百度登录框实现拖拽功能的代码应用
实现原理：获取拖拽后的offsetLeft与offersetTop的值来赋到style中
实现代码
用键盘控制box移动的代码实现
用keyCode实现移动
用switch实现的代码：要牢记，不熟悉
事件冒泡
事件冒泡指的是事件会从内到外传播
事件冒泡机制
事件冒泡浅体验
阻止事件冒泡
代码 高版本下可以直接用event.stopPropagation() 或者传入ev后用ev.stopPropagation()
低版本下代码：
function stopEvent(ev){
var ev=ev||window.event
if(ev&&ev.StopIteration){
ev.stopPropagation()
}else if(window.event){
window.event.cancelBubble=true
}
}
阻止事件冒泡代码
事件源
标准浏览器下target 非标准为srcElement
创建元素：creatElement
添加元素：appendChild
creatElement创建元素appendChild添加元素
以下代码与上面代码一起看
事件冒泡应用场景：事件委托（让它的父级来做）
网友评论