javascript使我们有能力创建动态页面，而事件是可以被javascript侦测到的行为
简单理解：触发--响应机制
网页中的每个元素都可以产生某些可以触发javascript的时间，比如我们可以在用户点击某按钮时产生一个事件，然后执行某些操作
事件由三部分组成：事件源、事件类型、事件处理程序(事件三要素)
事件源：事件被触发的对象--谁被触发了
事件类型：事件类型--如何触发，什么事件。如鼠标点击(onclick)还是经过，还是键盘按下
事件处理程序：事件处理程序：通过函数赋值的方式完成
<button id="btn">唐伯虎</button>
<script>
//点击按钮弹出对话框
//1.事件时有三部分注册
//1.事件源--谁被触发了
var btn = document.getElementById('btn');
//2.事件类型--如何触发，什么事件。如鼠标点击(onclick)还是经过，还是键盘按下
//3.事件处理程序：通过函数赋值的方式完成
btn.onclick = function() { //按钮(btn)被点击(onclick)
alert('点秋香');
}
</script>
image.png
1.获取事件源
2.注册事件(绑定事件)
3.添加事件处理程序(采取函数赋值形式)
<div>123</div>
<script>
//执行事件步骤：
//点击div 控制台输出 我被选中了
//1.获取事件源
var div = document.querySelector('div');
//2.绑定事件(注册事件) div.onclick
//3.添加事件处理程序
div.onclick = function() {
console.log('我被选中了');
}
</script>
image.png
| 鼠标事件 | 触发条件 |
|---|---|
| onclick | 鼠标点击左键触发 |
| onmouseover | 鼠标经过触发 |
| onmouseout | 鼠标离开触发 |
| onfocus | 获得鼠标焦点触发 |
| onblur | 失去鼠标焦点触发 |
| onmousemove | 鼠标移动触发 |
| onmouseup | 鼠标弹起触发 |
| onmousedown | 鼠标按下触发 |
