事件流
事件从页面中接收事件的顺序
image.png
事件捕获
从window对象传到目标节点(上层到下层),成为捕获阶段
事件冒泡
从目标节点传到window对象(下层到上层)
事件代理(事件委托)
原理:利用冒泡机制把所需要相应的事件绑定到外层
实现:
<body>
<ul id="list">
<li>1111111</li>
<li>22222222</li>
<li>43333</li>
</ul>
<script>
document.getElementById('list').addEventListener('click', function (e) {
// e.target IE8就有这个属性,所以IE8以上不需要写兼容
if (e.target && e.target.nodeName.toUpperCase() === 'LI') {
console.log(e.target)
}
})
</script>
</body>
IE8打印出来的event.png
网友评论