我们给外层元素监听事件,那么可以通过事件冒泡的原理使得它里面的所有元素都会有事件监听,这种机制叫做事件的委托。可以非常方便的提高程序性能,减小内存空间。
<body>
<div class="div1" id="div1">
div1
<div class="div2">
div2
<div class="div3">
div3
</div>
</div>
</div>
<script>
let div1 = document.querySelector(".div1")
div1.addEventListener('click', function(e) {
var ev = ev || window.event;
console.log("e", ev)
if (ev.target.nodeName == 'DIV') {
console.log("点击了", ev.target.className)
}
})
</script>
</body>

网友评论