用过事件委托的朋友想必都知道 可以解决新增的元素添加不上事件这种情况 和事件委托解决了这个好处
但是有时我们有这么一种结构 却还想用事件委托就无能为力了 例如
1 <div class=content> 2 3 <div class="list"> 4 <p>1111</p> 5 <h1>555</h1> 6 </div> 7 8 </div>
我们想要给content添加事件委托点击里面的list进行一些js操作 但是在我们判断点的是谁的时候就会发现 老是点到里面的p或者h1标签了 从而没有办法判断得到我们想要的
数据 此时你有可能说我把所有情况都写上就好了 哈哈 但是结构复杂了怎么办 今天发现了一个一个css属性
.item > * {
pointer-events: none;
}
给item下面的元素加上这个属性就好了 如果想让某一个元素有点击事件 就在改成
pointer-events: auto;
这个属性是穿透的意思
假如我们有这么一种需求 一个遮罩层下面有好多元素 下面元素有点击事件 因为被覆盖了 下面元素就没有反应了 给遮罩层加上就会穿透下去 触发这个点击事件 不过一般用的不多 了解就好了~~~