• JavaScript高级程序设计44.pdf


    unload事件

    与load事件对应的是unload事件,这个事件在文档被完全卸载后触发,只要用户从一个页面切换到另一个页面,就会发生unload事件,最多的情况是清除引用,避免内存泄漏

    与load事件类似,也有两种指定onunload事件的处理程序方式

    EventUtil.addHandler(window,"unload",function(event){

          alert("Unloaded");

        });

    为元素添加特性

    <body onunload="alert('Unloaded!')">

    根据“DOM2级事件”,应该<body>元素而非window对象上面触发unload事件,不过所有浏览器都在window上实现了unload事件,以确保向后兼容

    resize事件

    当浏览器窗口被调整宽度或者高度时,就会触发resize事件,同样2种方式

    EventUtil.addHandler(window,"resize",function(event){

          alert("Resized");

        });

    IE、Safari、Chrome和Opera会在浏览器变化1像素时就触发resize事件,然后随变化不断触发,Firefox则是在停止变化后触发事件,所以要避免大量的计算

    浏览器最大化最小化也会触发resize事件

    scroll事件

    scroll事件在window对象上发生,实际表示的是页面中相应元素的变化,在混杂模式下可以通过<body>元素的scrollLeft和scrollTop来监控这一变化;而在标准模式下,除Safari之外的所有浏览器都会通过<html>元素反映这一变化

    EventUtil.addHandler(window,"scroll",function(event){

          if(document.compatMode=="CSS1Compat"){

            alert(document.documentElement.scrollTop);

          }else{

            alert(document.body.scrollTop);

          }

        });

    这个事件同样应避免大量计算

    焦点事件

    焦点事件会在页面获得或失去焦点时触发,有以下6个焦点事件

    blur:在元素失去焦点时触发,这个事件不会冒泡,所有浏览器都支持它

    focus:在元素获得焦点时触发,这个事件不会冒泡,所有浏览器都支持它

    DOMFocusIn:在元素获得焦点时触发,DOM3级事件已废弃,只有Opera支持这个事件

    DOMFocusOut:在元素失去焦点时触发,DOM3级事件已废弃,只有Opera支持这个事件

    focusin:在元素获得焦点时触发,这个事件与HTML事件focus等价,但它冒泡,IE5.5+、Safari5.1+、Opera11.5+和Chrome支持

    focusout:在元素失去焦点时触发,这个事件与HTML事件blur等价,但它冒泡,IE5.5+、Safari5.1+、Opera11.5+和Chrome支持

    blur和focus不冒泡是最大的问题,IE的方式被DOM3级事件采纳为标准方式

    当焦点从页面中的一个元素移动到另一个元素,会依次触发下列事件:

    focusout→focusin→blur→DOMFocusOut→focus→DOMFocusIn

    鼠标与滚轮事件

    鼠标事件是Web开发中最常用的一类事件,DOM3级事件中定义了9个鼠标事件

    click:鼠标单击左键或键盘回车键

    dblclick:鼠标双击左键DOM3级将其纳入了规范,

    mousedown:按下任意鼠标按钮时触发,不支持键盘触发

    mouseenter:鼠标光标从元素外部首次移动到元素范围内时触发,该事件不冒泡。DOM3级将其纳入了规范,IE、Firefox9+和Opera支持这个事件

    mouseleave:鼠标光标从元素上方移动到元素范围外时触发,该事件不冒泡。DOM3级将其纳入了规范,IE、Firefox9+和Opera支持这个事件

    mousemove:鼠标指针在元素内部移动时重复地触发,不支持键盘触发

    mouseout:鼠标指针位于元素上方,用户将其移入另一个元素时触发,另一个元素可能位于前一个元素的外部也可能是这个元素的子元素,不支持键盘触发

    mouseover:鼠标指针位于一个元素外部,然后用户将其首次移入另一个元素边界之内时触发,不支持键盘触发

    mouseup:释放鼠标按钮时触发,不支持键盘触发

    上面的事件除了mouseleave和mouseenter,其余都会冒泡,也可以被取消,取消鼠标事件将会影响浏览器的默认行为

    事件与事件之间的联系非常紧密

    mousedown→mouseup→click→mousedown→mouseup→click→dblclick

    IE8及之前版本有个BUG,IE9修复了该BUG

    mousedown→mouseup→click→mouseup→dblclick

    检测浏览器是否支持DOM2级事件(除dblclick、mouseenter和mouseleave之外)

    var isSupported=document.implementation.hasFeature("MouseEvents","2.0");

    检测浏览器是否支持以上所有事件

    var isSupported=document.implementation.hasFeature("MouseEvent","3.0");

    注意:DOM3级事件的feature名是"MouseEvent",而非"MouseEvents"

    鼠标还有一类滚轮事件,mousewheel事件,用于跟踪鼠标滚轮

  • 相关阅读:
    selenium===介绍
    工具安装===Sublime Text-安装
    Django===django工作流
    python基础=== itertools介绍(转载)
    python基础===如何优雅的写代码(转自网络)
    python基础===一道小学奥数题的解法
    python基础===列表类型的所有方法
    python基础===通过菲波那契数列,理解函数
    python基础===字符串切片
    安全测试===BurpSuite使用教程-附安装包
  • 原文地址:https://www.cnblogs.com/sdgjytu/p/3781138.html
Copyright © 2020-2023  润新知