DOM事件委托

事件委托的原理就是利用事件的冒泡行为，不用给每个子节点单独设置事件监听器，而是在它们的父节点上设置事件监听器，然后利用冒泡原理影响设置每个子节点，这就是事件委托，这样只需要操作一次DOM，提高了程序的性能
案例：只要给ul注册鼠标经过事件，然后利用对象的target来找到当前的li，然后改变它的背景颜色，这样就不用给每个li添加事件了

<ul>
        <li>知否知否，点我应有弹框在手！</li>
        <li>知否知否，点我应有弹框在手！</li>
        <li>知否知否，点我应有弹框在手！</li>
        <li>知否知否，点我应有弹框在手！</li>
        <li>知否知否，点我应有弹框在手！</li>
    </ul>
    <script>
        // 事件委托的核心原理：给父节点添加侦听器， 利用事件冒泡影响每一个子节点
        var ul = document.querySelector('ul');
        ul.addEventListener('mouseover', function(e) {
            e.target.style.backgroundColor = 'pink';
        })
        ul.addEventListener('mouseout', function(e) {
            e.target.style.backgroundColor = '';
        })
    </script>