当前位置：网站首页>Use and description of event delegation

Use and description of event delegation

2022-06-30 09:56:00 【zimingyo】

Event delegation

summary

  • advantage ： Add an event to the parent element （ Can improve performance ）
  • principle ： Event delegation is actually the use of Event Bubbling Characteristics , Add an event to the parent element , Child elements can trigger
  • Realization ： Event object .target You can get the true trigger event element 
<body>
<ui>
  <li> first </li>
  <li> the second </li>
  <li> Third </li>
</ui>
<script> let ul=document.queryselect('ul') ul.addEventListener('click',function(e){
       console.log(e)// obtain Ul All event objects under  console.log(e.target)// Get the currently clicked li Elements  console.log(e.target.style.color='red')// Click on the current li, send li The color of the color changes to red  }) </script>
</body>
原网站

版权声明
本文为[zimingyo]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/181/202206300914332124.html

边栏推荐

猜你喜欢

随机推荐