javascript使我們有能力創(chuàng)建動態(tài)頁面，而事件是可以被javascript偵測到的行為
簡單理解：觸發(fā)--響應(yīng)機(jī)制
網(wǎng)頁中的每個元素都可以產(chǎn)生某些可以觸發(fā)javascript的時間，比如我們可以在用戶點擊某按鈕時產(chǎn)生一個事件变勇，然后執(zhí)行某些操作
事件由三部分組成：事件源等舔、事件類型缆巧、事件處理程序(事件三要素)
事件源：事件被觸發(fā)的對象--誰被觸發(fā)了
事件類型：事件類型--如何觸發(fā)司抱，什么事件绪励。如鼠標(biāo)點擊(onclick)還是經(jīng)過，還是鍵盤按下
事件處理程序：事件處理程序：通過函數(shù)賦值的方式完成
<button id="btn">唐伯虎</button>
<script>
//點擊按鈕彈出對話框
//1.事件時有三部分注冊
//1.事件源--誰被觸發(fā)了
var btn = document.getElementById('btn');
//2.事件類型--如何觸發(fā)澳眷，什么事件胡嘿。如鼠標(biāo)點擊(onclick)還是經(jīng)過，還是鍵盤按下
//3.事件處理程序：通過函數(shù)賦值的方式完成
btn.onclick = function() { //按鈕(btn)被點擊(onclick)
alert('點秋香');
}
</script>
image.png
1.獲取事件源
2.注冊事件(綁定事件)
3.添加事件處理程序(采取函數(shù)賦值形式)
<div>123</div>
<script>
//執(zhí)行事件步驟：
//點擊div 控制臺輸出 我被選中了
//1.獲取事件源
var div = document.querySelector('div');
//2.綁定事件(注冊事件) div.onclick
//3.添加事件處理程序
div.onclick = function() {
console.log('我被選中了');
}
</script>
image.png
| 鼠標(biāo)事件 | 觸發(fā)條件 |
|---|---|
| onclick | 鼠標(biāo)點擊左鍵觸發(fā) |
| onmouseover | 鼠標(biāo)經(jīng)過觸發(fā) |
| onmouseout | 鼠標(biāo)離開觸發(fā) |
| onfocus | 獲得鼠標(biāo)焦點觸發(fā) |
| onblur | 失去鼠標(biāo)焦點觸發(fā) |
| onmousemove | 鼠標(biāo)移動觸發(fā) |
| onmouseup | 鼠標(biāo)彈起觸發(fā) |
| onmousedown | 鼠標(biāo)按下觸發(fā) |
