当前位置: 开发笔记 > 编程语言 > 正文

e.target与e.currentTarget（事件委托）

作者：你去过的地方叫远方 | 来源：互联网 | 2023-10-11 17:55

case1:addEventListernerfalse冒泡点击father之后： target:fathercurrentTarget:father 点击son

case1: addEventListerner false 冒泡

点击father之后： target : father currentTarget:father

点击son之后： target : son currentTarget:father

case2: addEventListerner true 捕获

点击father之后： target : father currentTarget:father

点击son之后： target : son currentTarget:son

总结：target指的是被点击的DOM节点（触发点） currentTarget指的是：实际被监听的DOM节点（绑定点）

应用场景：事件委托：将事件绑定在父级元素上，利用事件的冒泡，以达到只绑定一个事件而能监听所有子集元素的目的，从而大幅提升性能，减少代码冗余。

在case1情况下 currentTarge不会改变

获取父子孙的tagName

可见，给最外层DOM节点绑定事件可以分别获取内部不同节点

参考实例：https://www.jianshu.com/p/ac47521806d2

RLLM->Remeber less, learn morn

推荐阅读

input
探索偶数次幂二项式系数的求和方法及其数学意义

探索偶数次幂二项式系数的求和方法及其数学意义 ... [详细]

蜡笔小新 2024-11-05 15:38:39
main
React项目基础教程第五课：深入解析组件间通信机制

React项目基础教程第五课：深入解析组件间通信机制 ... [详细]

蜡笔小新 2024-11-05 17:23:43
main
Python 实战：异步爬虫（协程技术）与分布式爬虫（多进程应用）深入解析

本文将深入探讨 Python 异步爬虫和分布式爬虫的技术细节，重点介绍协程技术和多进程应用在爬虫开发中的实际应用。通过对比多进程和协程的工作原理，帮助读者理解两者在性能和资源利用上的差异，从而在实际项目中做出更合适的选择。文章还将结合具体案例，展示如何高效地实现异步和分布式爬虫，以提升数据抓取的效率和稳定性。 ... [详细]

蜡笔小新 2024-11-05 14:12:56
match
如何在Spark数据排序过程中有效避免内存溢出（OOM）问题

本文深入探讨了在使用Spark进行数据排序时如何有效预防内存溢出（OOM）问题。通过具体的代码示例，详细阐述了优化策略和技术手段，为读者在实际工作中遇到类似问题提供了宝贵的参考和指导。 ... [详细]

蜡笔小新 2024-11-01 16:55:53
int
Python编程实用技巧与优化方法

本文介绍了 Python 编程中的一些实用技巧和优化方法。首先，讨论了如何高效地交换两个变量的值，例如 `a` 和 `b` 可以通过 `a, b = b, a` 来实现。此外，文章还提供了在进行数值比较时的简洁写法，如使用 `3.14` 进行精确匹配。这些技巧不仅提高了代码的可读性，还能提升程序的运行效率。 ... [详细]

蜡笔小新 2024-11-05 17:36:54
int
SQLite数据库CRUD操作实例分析与应用

本文通过分析和实例演示了SQLite数据库中的CRUD（创建、读取、更新和删除）操作，详细介绍了如何在Java环境中使用Person实体类进行数据库操作。文章首先阐述了SQLite数据库的基本概念及其在移动应用开发中的重要性，然后通过具体的代码示例，逐步展示了如何实现对Person实体类的增删改查功能。此外，还讨论了常见错误及其解决方法，为开发者提供了实用的参考和指导。 ... [详细]

蜡笔小新 2024-11-05 16:56:48
main
Python网络编程中的多线程应用与优化

在Python网络编程中，多线程技术的应用与优化是提升系统性能的关键。线程作为操作系统调度的基本单位，其主要功能是在进程内共享内存空间和资源，实现并行处理任务。当一个进程启动时，操作系统会为其分配内存空间，加载必要的资源和数据，并调度CPU进行执行。每个进程都拥有独立的地址空间，而线程则在此基础上进一步细化了任务的并行处理能力。通过合理设计和优化多线程程序，可以显著提高网络应用的响应速度和处理效率。 ... [详细]

蜡笔小新 2024-11-04 19:37:38
main
如何高效启动大数据应用之旅？

在前一篇文章中，我探讨了大数据的定义及其与数据挖掘的区别。本文将重点介绍如何高效启动大数据应用项目，涵盖关键步骤和最佳实践，帮助读者快速踏上大数据之旅。 ... [详细]

蜡笔小新 2024-11-04 18:30:38
int
基址获取与驱动开发：内核中提取ntoskrnl模块的基地址方法解析

基址获取与驱动开发：内核中提取ntoskrnl模块的基地址方法解析 ... [详细]

蜡笔小新 2024-11-04 15:56:02
main
深入解析 Vue 中的 Axios 请求库

本文深入探讨了 Vue 中的 Axios 请求库，详细解析了其核心功能与使用方法。Axios 是一个基于 Promise 的 HTTP 客户端，支持浏览器和 Node.js 环境。文章首先介绍了 Axios 的基本概念，随后通过具体示例展示了如何在 Vue 项目中集成和使用 Axios 进行数据请求。无论你是初学者还是有经验的开发者，本文都能为你解决 Vue.js 相关问题提供有价值的参考。 ... [详细]

蜡笔小新 2024-11-03 19:54:00
main
程序员如何高效开发软件：实用技巧与方法

在软件开发领域，如何提高开发效率是每个程序员关注的重点。应用软件开发涉及商业和日常生活等多个方面，其核心在于提升软件的实用性和用户体验。相较于纯粹的技术要求，应用软件更注重功能的实现和用户需求的满足。众多软件开发公司致力于这一领域，不断探索和实践高效的开发方法和技术，以确保软件的高质量交付。不同类型的应用软件，如办公自动化、财务管理、娱乐休闲等，都需根据具体应用场景进行定制化开发，以满足用户的多样化需求。 ... [详细]

蜡笔小新 2024-11-03 10:17:00
main
HTML5绘图功能的全面支持与应用

HTML5绘图功能的全面支持与应用 ... [详细]

蜡笔小新 2024-11-02 19:14:28
input
尝试对从复杂 XSD 生成的类进行序列化时出现 NullReferenceException 错误

在尝试对从复杂 XSD 生成的类进行序列化时，遇到了 `NullReferenceException` 错误。尽管已经花费了数小时进行调试和搜索相关资料，但仍然无法找到问题的根源。希望社区能够提供一些指导和建议，帮助解决这一难题。 ... [详细]

蜡笔小新 2024-11-02 17:25:38
int
MongoDB高可用架构：深入解析Replica Set机制

MongoDB的高可用架构主要依赖于其Replica Set机制。Replica Set通过多个mongod节点的协同工作，实现了数据的冗余存储和故障自动切换，确保了系统的高可用性和数据的一致性。本文将深入解析Replica Set的工作原理及其在实际应用中的配置和优化方法，帮助读者更好地理解和实施MongoDB的高可用架构。 ... [详细]

蜡笔小新 2024-11-02 12:54:33
int
Node.js 教程第五讲：深入解析 EventEmitter（事件监听与发射机制）

本文将深入探讨 Node.js 中的 EventEmitter 模块，详细介绍其在事件监听与发射机制中的应用。内容涵盖事件驱动的基本概念、如何在 Node.js 中注册和触发自定义事件，以及 EventEmitter 的核心 API 和使用方法。通过本教程，读者将能够全面理解并熟练运用 EventEmitter 进行高效的事件处理。 ... [详细]

蜡笔小新 2024-11-01 21:47:46

你去过的地方叫远方

这个家伙很懒，什么也没留下！

Tags | 热门标签

RankList | 热门文章