事件委托原理也很简单,假设你们班都买快递了,快递员需要一个一个打电话送吧,这样搞得化是不是效率太低了,这时候事件委托既体现出他的好了,在不考虑其他利益的时候快递员吧所有快递都给到辅导员,辅导员再群里面发一条信息叫谁来谁就来的吧
如下代码:有一个li 点击哪一个使哪一个变色
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
li{
cursor: pointer;
}
</style>
</head>
<body>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
<script>
const ul = document.querySelector('ul')
ul.addEventListener('click',()=>{
// event.target 是返回你点击的这一个元素但是需要该元素是ul的孩子
// tagName是返回给标签名字
if(event.target.tagName == 'LI'){
// 给我们点击的元素变色 这样我们就不用吧所有的li都获取来了
e.target.style.backgroundColor = 'red'
}
})
</script>
</body>
</html>
不用事件委托还需要把所有的lidou获取来,还要使用循环