美文网首页
3.16事件/storage

3.16事件/storage

作者: SuperSnail | 来源:发表于2016-03-16 10:59 被阅读56次

    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()

    相关文章

      网友评论

          本文标题:3.16事件/storage

          本文链接:https://www.haomeiwen.com/subject/fqmqlttx.html