事件冒泡
当事件发生后，这个事件就要开始传播(从里到外直到window或者从外向里)。事件源本身（可能）并没有处理事件的能力，即处理事件的函数（方法）并未绑定在该事件源上。
注意 ==这里传递的仅仅是事件并不传递所绑定的事件函数。所以如果父级没有绑定事件函数，即使事件确实传递了，也不会做出表现。==
<html>
<head>
<style type="text/css">
div.one
{
border-style: solid;
border-color: #0000ff
}
div.two
{
border-style: solid;
border-color: #ff0000 #0000ff
}
</style>
</head>
<body>
<div class="one" id="div1">
<div class="two" id="div2" href="http://www.baidu.com">
儿子儿子儿子
</div>
父亲父亲父亲
</div>
<script>
var div1 = document.getElementById("div1");
var div2 = document.getElementById("div2");
div2.onclick = function(){alert("这是儿子事件");};
div1.onclick = function(){alert("这是父亲事件");};
</script>
</body>
</html>
上面例子是非常典型的冒泡事件表现，点击div2，事件也将传递给div1（div2的父节点）。
显然这个特性有时也并不是我们所需要的，所以有对应的阻止冒泡的方法。
事件有个stopPropagation方法，只要调用该方法，事件将停止冒泡。在上例中给div2响应函数里调用可实现阻止。
div2.onclick = function(ev){
alert("这是儿子事件");
if ( e && e.stopPropagation )
e.stopPropagation();
else //IE取消事件冒泡的特殊处理
window.event.cancelBubble = true;
};
注意 IE浏览器较为特殊，调用cancelBubble = true来实现。
总结
https://www.cnblogs.com/julin-peng/p/3991522.html
1. event.stopPropagation()
事件处理过程中，阻止了事件冒泡，但不会阻击默认行为（它就执行了超链接的跳转）
2. return false
事件处理过程中，阻止了事件冒泡，也阻止了默认行为（比如刚才它就没有执行超链接的跳转）
3. event.preventDefault()
事件处理过程中，不阻击事件冒泡，但阻击默认行为（它只执行所有弹框，却没有执行超链接跳转）
