在事件流中,如果父级子级均有 addEventListener 注册事件并且第三个属性值为 false (冒泡阶段),我们点击 子级别 后就会连同 父级 一同输出,如果有更高级如 body document等也会依次由低到高输出,但是我们只想让其中某一级输出怎么办,这就用到了 阻止冒泡
e.stopPropagation()
<script>
var son=document.querySelector('.son');
var father=document.querySelector('.father');
son.addEventListener('click',function(e){
alert('son');
e.stopPropagation();
},false);
father.addEventListener('click',function(e){
alert('father');
e.stopPropagation();
},false);
document.addEventListener('click',function(e){
alert('document');
e.stopPropagation();
},false)
</script>
点击后每次只会弹出当前级别的提示框,不会再按照事件流的顺序依次执行