Web APls 第二天

DOM-事件基础

• 什么是事件？

事件是在编程时系统内发生的动作或者发生的事情

比如用户在网页上单击一个按钮

• 什么是事件监听？

​ 就是让程序检测是否有事件产生，一旦有事件触发，就立即调用一个函数做出响应，也称为 注册事件。

• 语法：元素.addEventListener ( '事件'，要执行的函数 )

• 事件监听三要素：

事件源： 那个dom元素被事件触发了，要获取dom元素。(谁被触发了)

事件： 用什么方式触发，比如鼠标单击 click、鼠标经过 mouseover 等。(用什么方式触发，点击还是鼠标经过等)

事件调用的函数： 要做什么事

---

事件监听：

let btn = document.querySelector('button') btn.addEcentListener('click',function(){ alert('唔做车手，做豆腐佬') })

事件类型：

【鼠标事件】 鼠标点击：click 鼠标经过：mouseenter 鼠标离开：mouseleave

【焦点事件】 获得焦点：focus 失去焦点：blor

【键盘事件】 键盘按下触发：Keydown 键盘抬起（松开）触发：Keyup

【文本事件；表单输入触发】 用户输入事件：input

---

1.什么是事件？

事件是在编程时系统内发生的动作或者发生的事情

比如点击按钮 click

2.什么是事件监听？

就是让程序检测是否有事件产生，一旦有事件触发，就立即调用一个函数做出响应，也称为 注册事件

3.事件监听三要素是什么？

事件源 (谁被触发了)

事件 (用什么方式触发，点击还是鼠标经过等)

事件处理程序 （要做什么事情）

---

案例较多，去敲就好【小米搜索框案例、微博输入案例、全选文本框案例 、购物车加减、】