6.22 webapi2

事件监听机制

例子

  btn.addEventListener('click', function() {
        console.log(123)
      })
​
​

1. btn:事件源，就是触发事件的dom元素
2. addEvenLsitener：事件监听机制提供的一个方法，通过它可以为元素绑定一个事件，并且再事件触发之后，调用指定的函数一定要进行处理
3. 'click'：事件类型，是指用户所进行的操作
4. function(){}：事件触发之后的处理函数

常用事件类型

鼠标事件

1. 单击：click
2. 鼠标进入：mouseenter
3. 鼠标离开：mouseleave

键盘事件

1. 键盘按下：keydown
2. 按键松开：keyup

焦点事件

1. 获取焦点：focus
2. 失去焦点：blur

输入框事件

1. 内容改变：input
2. 失去焦点且内容改变：change

change多用于file文件域，当用户选择好文件时触发

高阶函数

1. 简单说就是指函数的高级运用，这一阶段主要是指 将函数做为参数传递--回调函数
2. 回调函数：调用函数A，将函数B做为参数传递，函数B就称回调函数

• 回调函数是我们开发者准备的
• 但是回调函数不是我们自己调用的

环境变量

1. 指函数中的this
2. 那个元素触发了事件，这个元素就是事件处理函数中的this

排他思想

一.清除其它元素的效果，为当前元素添加效果

二.代码实现

1. 循环遍历 清除所有元素的样式，再为当前元素添加样式
2. 只找到有指定样式的元素清除样式，再为当前元素添加样式