事件委托的实现流程

事件委托的实现流程

  1. 找到要添加事件的节点:父节点

  2. 把事件添加在找到的父节点上

  3. 通过target触发对象,找到符合条件的元素节点,操作想要的效果

window.onload = function(){ 
    var oUl = document.getElementById('ull');
     var aLi = document.getElementsByTagName('li');

  oUl.onmouseover = function(ev){ 
     var event = ev||window.event;  //兼容 获取event对象
     var target = ev.target || ev.srcElement; //兼容 获取触发事件的目标对象
    
     if(target.nodeName.toLowerCase() == 'li'){  //判断目标对象是不是li
         target.style.background = 'green';
     }

  }

target.nodeName 弹出的名字是大写的,所以需要用toLowerCase() 转换成小写再比较。




posted @ 2020-04-22 15:32  文磊啊~  阅读(366)  评论(0编辑  收藏  举报