js事件之UI事件

UI事件
UI事件是那些不一定与用户操作有关的事件。这些事件在DOM规范出现之前，都是以这种或那种形式存在的。而在DOM规范中保留是为了向后兼容。现有的UI的事件如下：

1. load   完全加载后触发（页面window/body、框架、图像img、嵌入的内容script）
!!可以在body上执行onload的原因：在window上面发生的任何事件都可以在body元素中通过相应特性来指定，
因为在HTML中无法访问window元素。
2. unload 完全卸载后触发（页面window/body、框架、嵌入的内容script）
3. resize 窗口大小变化时在window上触发，框架大小变化时在框架上触发
4. scroll 带滚动条元素滚动时触发
5. select 用户选择文本框（input/textarea）中的字符时触发
6. error  发生错误时触发
7. abort  用户停止下载时，若内容未加载完成，在object上触发

1.load 事件
JavaScript 中非常常用的一个事件 load。当页面完全加载后（包括图像、JS文件、CSS文件等外部资源），就会触发 window 上面的 load 事件。

     window.onload=function(){};

2. unload 事件
与 load 事件对应，在文档被完全卸载后触发。
只要用户从一个页面切换到另一个页面，就会触发 unload 事件。
利用这个事件最多的情况是清除引用，以避免内存泄漏。
3. resize 事件
当浏览器窗口被调整的一个新的高度或宽度时，就会触发 resize 事件。
这个事件在 window 上面触发。
添加事件处理程序的方式仍然与 load 相同。
需要注意的是
不同的浏览器有不同的机制，因此最好不要在 resize 事件处理程序中加入大计算量的代码。
与其他发生在 window 上的事件类似，在兼容 DOM 的浏览器中，传入事件处理程序的 event 对象只包含 target 属性，值为 document。

    window.onresize=function(){};

4、scroll事件

虽然scroll事件是在window对象上发生的，但它实际表示的则是页面中相应元素的变化。在混杂模式下，可以通过 元素的scrollLeft和scrollTop来监控到这一变化；而在标准 模式下，除Safari之外的所有浏览器都会通过元素来反映这一变化（Safari仍然基于跟踪滚动位置），如下面的例子所示：

EventUtil.addHandler(window,'scroll', function(){
    if(documnent.compatMode == 'CSS1Compat') {
        alert(document.documentElement.scrollTop);
    } else {
        alert(document.body.scrollTop);
    }
})

以上代码指定的事件处理程序会输出页面的垂直滚动位置—–根据呈现模式不同使用了不同的元素。 由于 Safari3.1之前的版本不支持document.compatMode，因此旧版本的浏览器就不会满足第二个条件。
与resize事件类似，scroll事件也会在文档被滚动期间重复被触发，所以有必要尽量保持事件处理程序的代码简单。