事件傳遞機制：
例如鼠標被按下后，mousedown事件被觸發。
事件先從document->ancestor element->...->parent->event.target(在此元素上按下的鼠標)->parent->...->ancestor element->document.
事件走了一個循環，從documet到event.target再回到document，從event.target到document的過程叫做冒泡。
event.stopPropagation(); // 事件停止冒泡到，即不讓事件再向上傳遞到document，但是此事件的默認行為仍然被執行，如點擊一個鏈接，調用了event.stopPropagation()，鏈接仍然會被打開。
event.preventDefault(); // 取消了事件的默認行為，如點擊一個鏈接，鏈接不會被打開，但是此事件仍然會傳遞給更上一層的先輩元素。
在事件處理函數中使用 return false; 相當于同時調用了event.stopPropagation()和event.preventDefault()，事件的默認行為不會被執行，事件也不會冒泡向上傳遞。
新的添加事件機制使用el.addEventListener('click', function(event){}, false);
第三個參數是true或者false，一般都是使用false. 這個bool變量指示事件是使用capture還是bubble方式來處理。true表示使用捕捉方式，false使用冒泡方式，大多數情況下也是使用冒泡方式。
<div>
<a >Navigate to Apple</a>
</div>
如上兩個元素div和a，a是div的孩子元素，他們都使用了addEventListener注冊了click事件。
<body>
<div id="myDiv">
<a id="apple">Go to Apple</a>
</div>
</body>
document.getElementById("myDiv").addEventListener("click", function(event) {
console.log("click on div");
}, false);
document.getElementById("apple").addEventListener("click", function(event) {
event.preventDefault();
console.log("click on a");
}, false);
如果在myDiv上的第三個參數使用false, 則點擊鏈接后鏈接的click事件函數先執行，再執行myDiv的click事件處理函數。而如果使用的是true，則使用捕捉方式，所以myDiv的click事件處理函數先執行。