【事件】事件类型

DOM3 级事件规定了以下几类事件：

• UI（User Interface，用户界面）事件，当用户与页面上的元素交互时触发；
• 焦点事件，当元素获得或失去焦点时触发；
• 鼠标事件，当用户通过鼠标在页面上执行操作时触发；
• 滚轮事件，当使用鼠标滚轮（或类似设备）时触发；
• 文本事件，当在文档中输入文本时触发；
• 键盘事件，当用户通过键盘在页面上执行操作时触发；
• 合成事件，当为IME（Input Method Editor，输入法编辑器）输入字符时触发；
• 变动（mutation）事件，当底层 DOM 结构发生变化时触发。
• 变动名称事件，当元素或属性名变动时触发。此类事件已经被废弃，没有任何浏览器实现它们。

UI事件

UI事件指的是那些不一定与用户操作有关的事件。

事件	描述
DOMActivate	元素已经被用户操作（鼠标或键盘）激活。已被废弃。
load	页面完全加载完后在window上触发，所有框架加载完毕后在框架集上触发，图像加载完毕在img元素上触发，当嵌入内容加载完毕在object元素上触发。
unload	页面完全卸载（window触发），所有框架都卸载后（框架集触发），嵌入内容卸载完毕后（object触发）。
abort	当用户停止下载过程，如果嵌入内容没有加载完，则在object元素上除法。
error	当发生JavaScript错误时（window触发），当无法加载图像时（img触发），当无法加载嵌入内容时（object触发），当一或多个框架无法加载（框架集触发）。
select	当用户选择文本框（texterea或input）中的一个或多个字符时触发。
resize	当窗口或框架的大小变化时在window或框架上触发。
scroll	当用户滚动带滚动条的元素中的内容时，在该元素上触发。

多数这些事件都与window对象或表单空间相关。

除了DOMActivate之外，其他事件在 DOM2 级事件中都归为HTML事件（DOMActivate在 DOM2 级中任然属于UI事件）。
要确定浏览器是否支持“DOM3 级事件”定义的事件，可以使用如下代码：

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

1、load事件

js中最常用的一个事件就是load。当页面完全加载后（包括所有图像、js文件、css文件等外部资源），就会触发window上面的load事件。
有两种定义onload事件处理程序的方式。
1、使用JavaScript代码：

EventUtil.addHandler(window,"load",function(event){
    alert("Loaded");
});

2、为元素添加一个onload特性：

图像上面也可以触发load事件，无论是在DOM元素中的图像元素还是HTML中的图像元素。因此可以在HTML中为任何图像指定onload事件处理程序：

同样的功能也可以用javascript完成：

var img = document.getElementById("myImg");
EventUtil.addHandler(img,"load",function(event){
    event = EventUtil.getEvent(event);
    alert(EventUtil.getTarget(event).src);
});

在创建新的< img>元素时，可以为其指定一个事件处理程序，以便图像加载完毕后给出提示。此时，最重要的是要在指定src属性之前先指定事件。

//首先为window指定了onload事件处理程序。
//向DOM中添加一个新元素，必须确定页面已经加载完毕——如果在页面加载前操作document.body会导致错误。
EventUtil.addHandler(window,"load",function(){
    //然后，创建了一个新的图像元素，并设置了其onload事件处理程序。
    var image = document.createElement("img");
    EventUtil.addHandler(image,"load",function(event){
        event = EventUtil.getEvent(event);
        alert(EventUtil.getTarget(event).src);
    });
    //最后将这个图像添加到页面中，还设置了它的src属性。
    document.body.appendChild(image);
    image.src = "smile.gif";
    //新图像元素不一定要从添加到文档后才开始下载，只要设置了src属性就会开始下载。
});

还有一些元素也以非标准的方式支持load事件：