JS之事件的基础知识

一、交互

你对页面或什么东西做了些小动作，浏览器都会返回给你一个效果

• 事件是天然存在的，事件操作是交互体验的核心功能
• 事件类型：发生什么事情；点击、鼠标按下、鼠标抬起、鼠标移入、鼠标移出、键盘按下、键盘抬起…
• 事件流：当某个事件发生的时候，哪些元素会监听到该事件发生，这些元素发生该事件的顺序。
• 当一个元素发生了某个事件时，那该元素的所有祖先元素都发生了该事件
• 事件源、事件目标：事件目标阶段的元素

二、如何绑定事件

1、ele.onXXX = function (event) {}

①兼容性很好，但是一个元素只能绑定一个处理程序
②基本等同于写在HTML行间上

2、ele.addEventListener (type,fn,false);——type是事件类型，fn是函数

①在IE8及以下不兼容，需要使用attachEvent,detachEvent添加和移除事件
②可以为某个元素的同一个事件添加多个处理程序，按照注册的先后顺序运行
③允许开发者控制事件处理的阶段，使用第三个参数，表示是否在捕获阶段触发。（如果元素是目标元素（事件源），第三个参数无效）
④如果要移除事件，不能使用匿名函数

3、ele.attachEvent (‘on’ + type,fn);——type是事件类型，fn是处理函数

①IE独有
②可以一个事件绑定多个处理程序，而且同一个函数可以重复多次绑定

三、事件处理程序的运行环境