WebAPIs(事件绑定 类型)

一.事件监听:

       事件监听就是在网页上操作点击触发等就调用一个函数做出响应,也称为注册事件

       事件监听三要素:

• 事件源(谁被触发了)
• 事件类型(用什么方式触发,点击还是鼠标经过)
• 事件调用函数:(要做什么事)

元素对象.addEventListener('事件类型',要执行的函数)

---

二.事件类型:

• 鼠标点击:click          鼠标双击:dblclick     鼠标经过:mouseenter    鼠标离开:mouseleave          鼠标经过:mouseover         鼠标离开:mouseout
• 表单获取光标             获得焦点  focus      失去焦点:blur
• 键盘触发                    keydown键盘按下触发    keyup键盘抬起触发
• 表单输入触发            input 用户输入事件

---

三.事件对象:

           事件对象也是个对象，这个对象里有事件触发时的相关信息 , 在事件处理函数的第一个参数就是事件对像

元素.addEventListener('click',function(e){

})

部分常用属性:

• type  获取当前的事件类型 
• clientX/clientY : 获取光标相对于浏览器可见窗口左上角的位置
• pageX/pageY : 获取光标相对于当前DOM元素左上角的位置
•  key 用户按下的键盘键的值

---

四.环境对象:

环境对象就是函数内部特殊的变量this,代表当前函数运行时所处的环境

作用:函数的调用方式不同,this指代的对象不同

        谁调用谁,this就是谁

        直接调用函数,其实相当于是window.函数,所有this指代window

---

五.回调函数:

如果将函数A做为参数传递给函数B时,我们成函数A为回调函数

回调函数就是当一个函数当做参数来传递给另一个函数的时候

function fn(){
      console.log('我是回调函数...')
}
//fn传递给了setInterval,fn就是回调函数
setInterval(fn,1000)



box.addEventListener('click',function(){
          console.log('我也是回调函数')
})

   回调函数本质还是函数，只不过把它当成参数使用