当我们遇到给一组元素加相同的事件,常常用到循环,看似语句很少,感觉性能提高,其实不然,运用循环,还是执行了一组元素的长度次数的代码,所有在遇到给一组元素加相同的事件的时候,我们可以运用事件委托的方法,大大的提高了代码执行的性能。
事件委托的思路:
1.把事件加给父级:
事件触发时,找触发事件的事件源
语句:ev.target 兼容高级浏览器
ev.srcElement 兼容非火狐
考虑到浏览器兼容问题: var oSrc=ev.target||ev.srcElement
2.判断事件的源头是不是我们想要的元素
语句:.tagName
.nodeName
.className
事件委托本质:是通过事件冒泡来实现
具体例子如下:
让一堆元素点击变色:有一组相同的元素,设置好宽高,背景颜色,依次点击让它们变成红色
代码如下图:
HTML部分:
css部分:
js部分:
网友评论