e.srcElement;
console.log(e);
switch (target.textContent) {
case "menu-1":
console.log("menu-1 被点击了");
break;
case "menu-2":
console.log("menu-2 被点击了");
break;
case "menu-3":
console.log("menu-3 被点击了");
break;
case "menu-4":
console.log("menu-4 被点击了");
break;
case "menu-new":
console.log("menu-new 被点击了");
break;
}
}
var addBtnEl = document.getElementById("addBtn");
addBtnEl.onclick = function() {
var newEl = document.createElement('li');
newEl.innerHTML = "menu-new"
menu.appendChild(newEl);
}
}
</script>
menu 列表的每个子菜单元素的事件都能正确响应，新增的 menu-new 同样也能正确响应事件。
事件委托的好处在于，我们不用给每个元素都一一地手动添加绑定事件，避免重复低效的工作。
其次，事件委托更少得获取 dom, 初始化元素对象和事件函数，能有效减少内存占用。
每当将事件程序指定给元素时，html 代码和 js 代码之间就建立了一个连接，这种连接越多，网页就执行起来越慢，所以事件委托能有效减少连接树，提高网页性能。
总结
用户与网页的交互是通过事件进行的，事件模型分为事件冒泡和事件捕获，事件冒泡的兼容性更好，应用更广，同时通过事件冒泡，可以建立事件委托，提升网页性能。
以上就是JavaScript中事件模型的详解（代码示例）的详细内容，更多请关注php中文网其它相关文章！
网站建设是一个广义的术语，涵盖了许多不同的技能和学科中所使用的生产和维护的网站。
关键词：JavaScript中事件模型的详细说明（代码示例）