携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第16天，点击查看活动详情
3、事件处理程序
事件处理程序即对事件的响应代码。可以是一行或几行脚本语句，如果代码量较大，则应用自定义函数包装这些脚本代码。
事件与事件处理程序的关联方式一共有三种：
- 一是通过标签的事件属性
- 二是通过对象的事件属性
- 三是attachEvent或addEventListener
①标签的事件属性示例：
function body_load(){
alert("body标签的onload属性 .页面加载");
}
<body οnlοad="body_load();"></body>
// onload方法是加载时触发该动作，上面代码的含义是在页面加载body标签时调用javascript的body_load()方法，而该方法运行结果是弹出一个警告对话框，消息内容为 body标签的onload属性 .页面加载。
②对象的事件属性示例：
<script>
对象.事件属性 = 事件处理程序;
</script>
function window_resize(){
alert("Window对象的onresize事件.窗口尺寸变化");
}
window.onresize = window_resize;
// 以上javascript代码的含义是：浏览器窗口尺寸发生变化时，执行window_resize方法体中的事件处理程序代码。
4、事件对象
事件发生时，可能需要获得与此事件相关的信息，比如鼠标事件发生时鼠标的坐标，键盘事件发生是哪个键引起的，事件发生在哪个对象上等等。这些与事件的状态相关的信息可以Event事件对象获得。
①事件对象的获取示例
注意：要获得Event事件对象，可以在事件处理程序中访问Window对象的event属性，即window.event ，但这种方式仅适用于IE浏览器。在面向其他浏览器的代码中，应向事件处理函数传递event实参，这样在事件处理函数中可用形参表示Event对象。
<html>
<head>
<script>
function fun(evt) {
//[事件处理程序，在这里可用形参evt表示Event事件对象]
alert('evt.button返回当事件被触发时，哪个鼠标按钮被点击:' + evt.button);
alert(' evt.clientX返回当事件被触发时，鼠标指针相对于页面正文的水平坐标:' + evt.clientX);
alert('evt.clientY返回当事件被触发时，鼠标指针相对于页面正文的垂直坐标:' + evt.clientY);
alert('evt.screenX返回当事件被触发时，鼠标指针相对于页面正文的垂直坐标:' + evt.screenX);
alert('evt.screenY返回当事件被触发时，鼠标指针相对于页面正文的垂直坐标:' + evt.screenY);
alert('evt.ctrlKey返回当事件被触发时，"CTRL" 键是否被按下:' + evt.ctrlKey);
alert('evt.shiftKey返回当事件被触发时，"SHIFT" 键是否被按下:' + evt.shiftKey);
alert('evt.altKey返回当事件被触发时，"ALT" 键是否被按下:' + evt.altKey);
alert('evt.type返回事件的类型:' + evt.type);
alert('evt.keyCode返回键的虚拟键盘代码或此键的字符的Unicode码。:' + evt.keyCode);
}
</script>
</head>
<body>
<input type="button" id="btn" value="点我" οnclick="fun(event);" />
</body>
</html>
