js事件委托详解
更新时间：2021年11月04日 08:35:15 作者：小妮浅浅
在本篇文章里小编给大家整理的是一篇关于js事件委托详解以及相关实例内容，有兴趣的朋友们可以跟着学习下。
1、每个函数都是对象，占用内存。内存中的对象越多，性能越差。解决事件处理过多问题的办法是事件委托。
2、事件委托冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。
实例
<ul id="myLinks">
<li id="myLi1">text1</li>
<li id="myLi2">text2</li>
<li id="myLi3">text3</li>
</ul>
Ie9以下浏览器中的事件对象是放在全局中的window.event;
解决兼容性：event = event || window.event
事件委托（就是将事件绑定到父级/爷爷级对象上，通过事件对象的target属性来控制子级对象的改变）：
event.target（点击的目标对象）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
td{
width: 100px;
height: 100px;
border:2px solid red;
}
</style>
</head>
<body>
<table >
<tr>
<td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td>
</tr>
</table>
</body>
<script>
var tab = document.getElementsByTagName("table")[0];
tab.onclick = function (event) {
//点击子级对象改变颜色
event.target.style.backgroundColor = "black";
}
</script>
</html>
到此这篇关于js事件委托详解的文章就介绍到这了,更多相关js事件委托如何理解内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了javascript this详细介绍的相关资料,需要的朋友可以参考下2016-09-09
在JavaScript中操作时间之getUTCDate()方法的使用
这篇文章主要介绍了在JavaScript中操作时间之getUTCDate()方法的使用,是JS入门学习中的基础知识,需要的朋友可以参考下2015-06-06
标准库指的是js的标准内置对象，是js这门语言本身初始时提供的在全局范围的对象,需要的朋友可以参考下2018-05-05
JavaScript的document对象和window对象详解
JavaScript的document对象和window对象详解,js经常用得到的知识，了解下。2010-12-12
下面小编就为大家带来一篇浅谈javascript中关于日期和时间的基础知识。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-07-07
这篇文章主要介绍了js单词形式的运算符,需要的朋友可以参考下2014-05-05
这是一篇关于javascript三元运算符的相关基础知识点内容，大家可以学习一下巩固基础知识。2018-09-09
js静态作用域的功能。...2006-12-12
用js自动判断浏览器分辨率的代码...2007-01-01
JavaScript fontcolor方法入门实例（按照指定的颜色来显示字符串）
这篇文章主要介绍了JavaScript fontcolor方法入门实例,fontcolor方法用于按照指定的颜色来显示字符串,需要的朋友可以参考下2014-10-10
最新评论