Table上进行事件代理(委托)时,为什么捕获不到TR

Question

在table上绑定了一个mouseover事件,目的是打算移动到哪一行就拿到哪一行的数据.但是发现不管是把事件设置在捕获阶段还是冒泡阶段,只能拿到td拿不到tr这是怎么回事大佬求帮助

TABLE.addEventListener('mouseover', (e)=>{  console.log(e.target.tagName);  
  if(e.target.tagName === 'TR') {    console.log(e.target);    //始终不会执行
  }
},false)

Answer 1

tr标签被td完全遮盖住，所以mouseover根本不会降临到tr上，都是在td上直接触发。实验中会发现先触发是table，因为table默认有边框或单元格空隙，鼠标从外部进入table晃过时先经过table的边框或单元格空隙， 可以通过把table的border和cellspacing设置为0验证，table将不会被mouseover。

Answer 2

时间冒泡并不是所有节点都触发一次，而是从最下层的节点，逐级向上传递。所以你这样是无法捕捉到&nbsp;<tr>&nbsp;触发的事件的，因为它不是最下层，它下面还有&nbsp;<td>。我不知道你要干嘛，我想象不到为啥要只捕获&nbsp;<tr>。