3.16事件/storage

DOM0级事件处理程序

使用DOM0级方法指定的事件处理程序被认为是元素的方法，这时的事件处理程序是在元素的作用域中运行。

删除事件处理程序
btn.onclick = null;

DOM2级事件处理程序

addEventListener removeEventListener
addEventListener可以添加多个事件处理程序，执行顺序与添加顺序一样
在移除时，传入的参数要和添加处理程序时使用的参数相同。
所以removeEventListener没法移除直接在addEventListener里添加的匿名函数
解决办法是把函数拿出来，并变成具名
然后把方法名放到addEventListener和removeEventListener里用

ie9+都支持DOM2级事件处理程序

IE事件处理程序

attachEvent detachEvent
这两个方法都是带两个参数，注意第一个参数应该是类似‘onclick’这样的，而不是和DOM2一样用'click'
没有第三个参数，因为都是在冒泡阶段执行
事件的作用域是全局作用域window
可以添加多个事件，执行顺序和添加顺序相反
移除的方法同removeEventListener

支持IE事件处理程序的浏览器有IE和Opera

事件对象

在触发DOM上的某个事件时，会产生一个事件对象event，这个对象中包含着所有与事件相关的信息。

DOM中的事件对象

bubbles 是否冒泡
cancelable 是否可以取消事件的默认行为
currentTarget 当前正在处理事件的那个元素
defaultPrevented 为true表示已经调用了preventDefault()
detail 与事件相关的细节信息
eventPhase 调用事件处理程序的阶段，1表示捕获阶段，2表示处于目标，3表示冒泡阶段
preventDefault()取消事件的默认行为，如果cancelable是true，则可以使用这个方法
stopPropagation()取消事件的进一步捕获或者冒泡
target 事件的目标
type 被触发的事件类型

IE的事件对象

cancelBubble 默认值为false 设为true可以取消事件冒泡
returnValue 默认为true，设为false可以取消事件的默认行为
srcElement 事件的目标
type 被触发的事件类型

resize事件，FF只有在用户停止调整窗口大小时才会触发resize事件。IE，chrome，safari，opera会在窗口变化一像素时触发resize事件

clientX clientY相对于浏览器视口
screenX screenY 相对于整个屏幕
pageX pageY 相对于页面本身
在页面没有滚动的情况下clientX和pageX相等Y也是

event.shiftkey
event.ctrlkey
event.altkey
event.metakey
IE9+支持这四个键，IE8-不支持metakey（window中的win键，mac中的command键）

storage不能直接存对象，这样输出来是个字符串，默认会调用toString()方法
解决办法是，
用JSON.stringify()和JSON.parse()