阻止事件默认行为和阻止事件冒泡

<div id="wrap" style="width: 200px; height: 200px; background: gray;">
    <div id="btn" style="width: 100px; height: 100px; background: orangered;"></div>
    <a id="prevent" target="_blank" href="http://www.baidu.com">preventDefault</a>
</div>

标准浏览器的使用方法 preventDefault(): 用于阻止事件的默认行为; 比如： a 链接的跳转行为和表单自动提交行为　　

var prevent = document.getElementById("prevent");
    prevent.addEventListener("click", function(event){
        event.preventDefault();
    }, false);

//使用preventDefault()方法就阻止了a标签打开新窗口的默认行为

stopPropagation(): 用于阻止事件的进一步获取和传播; 比如：阻止事件继续向上层冒泡

var btn = document.getElementById("btn"),
    wrap= document.getElementById("wrap");
    btn.addEventListener("click",function(event){
        alert("btn");
        event.stopPropagation();
    },false);
    wrap.addEventListener("click",function(){
        alert("wrap");
    },false);

//点击btn时，这样就阻止了id="btn"向上级id="wrap"冒泡，打印出来的结果是：弹窗仅弹出btn。否则，将会先弹出btn，然后弹出wrap。

event.returnValue = false; //阻止事件的默认行为; event.cancelBubble = true; //阻止事件的进一步获取或者冒泡;

function prevent(event) {
    event = event || window.event;
    if(event.preventDefault) {
        event.preventDefault();
    } else {
        event.returnValue = false; 
    }
}
//使用 if else 去判断