JavaScript 阻止默认时间和冒泡时间

<!DOCTYPE HTML>

<html>

<head>

<title>event cancel</title>

</head>

<body>

<a href="https://www.baidu.com/">baidu</a>

<div >click me</button>

</div>

</div>

</body>

</html>

<script type="text/javascript" >

document.getElementsByTagName("a")[0].onclick = function(e){

cancelHandler(e); //取消a标签打开连接的事件, 然后执行click事件

alert("cancel the default event!");

}

function cancelHandler (event) {

  var event = event || window.event; // for ie

  //取消事件相关的默认行为

  if(event.preventDefault) event.preventDefault(); //标准技术

  if(event.returnValue) event.returnValue = false;

  return false; //用于处理对象属性注册的处理程序。

}

//测试冒泡时间

document.getElementById("d1").onclick = function () {

  alert("d1 clicked");

}

document.getElementById("d2").onclick = function () {

  alert("d2 clicked");  //点击d2会触发两次点击时间, 一次是d2自己的, 第二次是父亲d1的

}

document.getElementById("btn1").onclick = function (e) {

  e.stopPropagation(); //阻止向上冒泡

  alert("button clicked");

}

</script>