事件流指的是
1.节点的捕获
2.处理事件
3.事件的冒泡
目前分为事件冒泡流，事件捕获流；
区别：
1.事件冒泡流在事件冒泡阶段响应事件
2.事件捕获流在捕获节点过程响应事件。
3.大部分浏览器默认的都是事件源冒泡流的方式来响应事件
使用：
addEventListener最后一个参数， 为true则代表使用事件捕获模式 ，false则表示使用事件冒泡模式。
事件冒泡流是如何绑定到对应的元素上的？又是如何做出响应？
1.从根元素html一级一级往内寻找，直到找到id="getCopy"的元素
2.为这个元素处理click事件
3.根据事件冒泡法从这个元素一级一级往外响应事件，直到根节点
var btn = document.getElementById('getCopy');
btn.addEventListener('click', function(){
console.log('btn click');
}, false);
事件捕获流是如何绑定到对应的元素上的？又是如何做出响应？
1.从根元素html往内寻找，寻找过程中一级一级往内响应事件，直到找到id="getCopy"的元素
2.为这个元素处理click事件
3.从这个元素开始往外一级一级的事件冒泡，直到根节点
var btn = document.getElementById('getCopy');
btn.addEventListener('click', function(){
console.log('btn click');
}, true);
addEventListener同一个元素绑定相同的事件和方法，后一个会覆盖前一个
var btn = document.getElementById('getCopy');
var btnFun = function(){
console.log('btn click');
}
btn.addEventListener('click', btnFun, false);//该事件被后一个覆盖
btn.addEventListener('click', btnFun, false);//输出 btn click
addEventListener同一个元素绑定相同的事件和不同的方法，后一个不会覆盖前一个
var btn = document.getElementById('getCopy');
btn.addEventListener('click', function(){
console.log('btn click1');//输出 btn click1
}, false);
btn.addEventListener('click', function(){
console.log('btn click2');//输出 btn click2
}, false);
阻止事件冒泡 stopPropagation
btn.addEventListener('click', function(event){
console.log('btn click2');//输出 btn click2
event.stopPropagation();
}, false);
