<!DOCTYPE HTML>
<html>
<head>
<title>取消与利用冒泡</title>
<meta charset="utf-8"/>
</head>
<body>
<div id="keys">
<button>1</button>
<button>2</button>
<button>3</button>
<button>4</button><br>
<button>C</button>
<button>+</button>
<button>-</button>
<button>=</button>
</div>
<textarea id="sc" style="resize:none;width:200px; height:50px;" readonly></textarea>
<script>
//利用冒泡:优化——尽量减少事件监听的个数
//id全局变量,可省略查找
keys.onclick=function(e){
//var btn=this;不能再用this,因为事件绑定在父元素div上,this指的是父元素。
// e.target会始终保存着最初触发事件的目标元素,且不随冒泡而改变
var btn=e.target;
//
if(btn.nodeName==="BUTTON"){
alert(`${btn.innerHTML}滚!`)
}
}
</script>
</body>
</html>