1.HTML事件处理
直接添加到HTML结构中,不过这样的不利于保证HTML页面和JS的分离。不推介。
demo:
2、DOM 0级事件处理函数
把一个函数赋值给事件处理程序属性。js与页面分离的方法,但是不能够进行叠加,也就是对同一个Element赋值两个函数,第一个函数将被第二个覆盖。
demo:
运行
demo:
运行:
3、DOM 2级事件处理
addEventListener("事件名","事件处理函数","布尔值") ------添加事件
removeEventListener("事件名","事件处理函数","布尔值")------移除事件
这两个函数中布尔值的参数可以省略。
DOM 2级事件处理弥补了DOM 0级事件处理会被覆盖的不足,DOM2级事件处理可以在同一个属性上添加1种或者1种以上的事件处理函数。
demo:
运行: 连续弹出两个Alert框。
移除是相同的用法。
4、IE事件处理程序
attachEvent("事件名","事件处理函数") -----添加事件
detachEvent("事件名","事件处理函数") ----- 移除事件
这两个方法是IE版本小于等于8时可用。
注:在浏览器的兼容问题,可用一个if语句解决。