当前位置: 首页 > news >正文

JavaScript(20)——事件委托

事件委托是利用事件流的特征解决一些开发需求的知识技巧

优点:减少注册次数,提高程序性能

原理:利用事件冒泡的特点。

给父元素注册事件,当我们触发子元素的时候,会冒泡到父元素上,从而触发父元素事件。

真正触发的元素:e.target.tagName

<body><ul><li>111</li><li>222</li><li>333</li><li>444</li><p>我不变红</p></ul><script>//获取父元素const t = document.querySelector('ul')t.addEventListener('click', function (e) {//console.log(e.target)  点击的对象// e.target.style.color = 'red' //点击后变红if (e.target.tagName === 'LI') {e.target.style.color = 'red'}})</script>
</body>

相关文章:

JavaScript(20)——事件委托

事件委托是利用事件流的特征解决一些开发需求的知识技巧 优点&#xff1a;减少注册次数&#xff0c;提高程序性能 原理&#xff1a;利用事件冒泡的特点。 给父元素注册事件&#xff0c;当我们触发子元素的时候&#xff0c;会冒泡到父元素上&#xff0c;从而触发父元素事件。…...

Linux系统安装opencv

在Linux系统上安装OpenCV时&#xff0c;使用pip install opencv-python-headless是一个常见的选择。以下是安装OpenCV的步骤总结&#xff1a; 安装步骤&#xff1a; 更新系统软件包&#xff08;可选&#xff09;&#xff1a; sudo apt update sudo apt upgrade安装pip&#xf…...

nginx反向代理+nginx黑白名单+nginx负载均衡+平滑升级+配置jdk环境-7.30

一、反向代理 1.前端服务器配置 前端服务器&#xff1a;用于接收和响应客户端&#xff0c;代理另一台主机 Nginx 安装 (1).下载安装nginx [rootweb ~]# wget https://nginx.org/download/nginx-1.26.1.tar.gz (2).解压 [rootweb ~ ]# tar -zxvf nginx-1.26.1.tar.gz (3…...

C# Unity 面向对象补全计划 之 访问修饰符

本文仅作学习笔记与交流&#xff0c;不作任何商业用途&#xff0c;作者能力有限&#xff0c;如有不足还请斧正 本系列旨在通过补全学习之后&#xff0c;给出任意类图都能实现并做到逻辑上严丝合缝...

JAVA多线程设计模式 (多线程程序的衡量标准)

前言 如果你对一个程序的评价方式还停留在“这个程序写得不错”、“这个程序写得太差”的程度&#xff0c;这样很难看出你是否确实分析了程序的构造。不要只是“好不好”应该要有一个“好在哪里&#xff0c;不好在哪里”的评量标准。 一、下载地址 下载地址&#xff1a;JAVA…...

消息队列使用

消息队列在分布式系统中扮演着非常重要的角色,其主要用途包括但不限于以下几点: 解耦: 消息队列可以减少应用程序之间的直接依赖,使系统各部分更加独立。例如,在一个电子商务网站中,订单系统可以将订单信息发送到消息队列中,而不必直接调用库存系统。库存系统可以从队列…...

Windows 10+Visual Studio2019 Opencv-C++安装配置

前往官网下载需要的版本Releases - OpenCVhttps://opencv.org/releases/ 1.下载并解压OpenCV 我选择4.6.0&#xff0c;点击windows版本&#xff0c;进行下载 2.配置项目属性 打开你的Visual Studio 2019项目 -> 右击项目名&#xff0c;选择“属性” 注&#xff1a;整个配…...

百易云资产管理运营系统 comfileup.php 文件上传致RCE漏洞复现(XVE-2024-18154)

0x01 产品简介 百易云资产管理运营系统,是专门针对企业不动产资产管理和运营需求而设计的一套综合解决方案。该系统能够覆盖资产的全生命周期管理,包括资产的登记、盘点、评估、处置等多个环节,同时提供强大的运营分析功能,帮助企业优化资产配置,提升运营效率。 0x02 漏…...

【学习笔记】Redis学习笔记——第17章 集群

第17章 集群 17.1 节点 使用cluster meet命令将其他节点添加到当前节点集群中 17.1.1 启动节点 通过cluster-enabled设置来决定是否启用集群 17.1.2 集群数据结构 每个节点都保存了自己及其他节点的IP端口号等信息 17.1.3 cluster meet命令的实现 是收到命令的节点和新…...

Vue - CSS基础学习

一、元素及属性 CSS 是为 web 内容添加样式的代码。 style标签 1.语法 1.除了选择器部分&#xff0c;每个规则集都应该包含在成对的大括号里&#xff08;{}&#xff09;。 2.在每个声明里要用冒号&#xff08;:&#xff09;将属性与属性值分隔开。 3.在每个规则集里要用分号…...

python setup.py install

有三种方法安装pyinstaller&#xff0c;而我唯独用下面这种最方便&#xff0c;又成功。 下载源码安装包&#xff0c;然后解压安装包&#xff0c;打开cmd并进入安装包解压目录&#xff0c;可以看到该目录下有一个setup.py的文件。 执行命令&#xff1a;python setup.py instal…...

论文解读:DiAD之SG网络

目录 一、SG网络功能介绍二、SG网络代码实现 一、SG网络功能介绍 DiAD论文最主要的创新点就是使用SG网络解决多类别异常检测中的语义信息丢失问题&#xff0c;那么它是怎么实现的保留原始图像语义信息的同时重建异常区域&#xff1f; 与稳定扩散去噪网络的连接&#xff1a; S…...

Prometheus+Grafana 监控平台实践-搭建常用服务监控告警

前言 Prometheus 是一个开放性的监控解决方案,通过各种 Exporter 采集当前主机/服务的数据,和 Grafana 相结合可以实现强大的监控和可视化功能 本篇将分享使用 docker compose 构建 Prometheus+Grafana,并监控之前文章所搭建的主机&服务,分享日常使用的一些使用经验 文…...

leaflet加载天地图:卫星底图(影响地图) 和 路网底图(矢量地图)【webgis】

文章目录 引言I 申请Key1.1 应用创建1.2 账号认证II 使用申请的key进行相关的服务调用2.1 服务API2.2 初始化地图组件2.3 加载影像底图和影像注记2.4 地理编码查询引言 自己没有对应的地图服务器和地理查询服务器的时候,使用天地图来实现业务的快速支撑。 基于天地图使用Leaf…...

微软蓝屏事件:全球网络安全与系统稳定性的警示

文章目录 每日一句正能量前言探讨软件更新流程中的风险管理和质量控制机制软件更新的风险风险管理策略质量控制措施测试流程缺陷识别实施质量控制结论 提供预防类似大规模故障的最佳方案或应急响应对策设计冗余系统实施灾难恢复计划建立高可用架构应急响应对策利用自动化工具和…...

【51单片机仿真】基于51单片机设计的整数/小数计算器系统仿真源码文档——文末资料下载

演示: 摘要 本项目设计并实现了一种基于51单片机的多功能计算器系统。系统采用STC89C52单片机作为主控制器,结合LCD显示模块、矩阵键盘等外设,实现了基本的整数、小数算术运算功能,包括加、减、乘、除、取模等。本文详细介绍了系统的硬件设计和软件实现,并对系统的功能和…...

ubuntu安装dockergitlab

#更换阿里云进行配置GPG 密钥 curl -fsSL https://mirrors.aliyun.com/docker-ce/linux/ubuntu/gpg | sudo apt-key add - sudo add-apt-repository \ "deb [archarm64] https://mirrors.aliyun.com/docker-ce/linux/ubuntu $(lsb_release -cs) stable" #如果出现错…...

自定义视图提示:提升Laravel用户体验的秘诀

自定义视图提示&#xff1a;提升Laravel用户体验的秘诀 在Laravel框架中&#xff0c;视图提示是一种向用户显示友好信息的方式&#xff0c;它们可以是表单输入后的错误信息、成功通知或其他重要的用户反馈。自定义视图提示不仅可以增强用户体验&#xff0c;还可以使应用程序的…...

关于黑马Ajax项目的笔记

一、token的介绍 概念&#xff1a; 访问权限的令牌&#xff0c;本质上是一串字符串 创建&#xff1a; 正确登录后&#xff0c;由后端签发并返回 作用&#xff1a; 判断是否有登录状态等&#xff0c;控制访问权限 注意 前端只能判断token有无&#xff0c;后端才能判断to…...

Java面试八股之JDK 动态代理和 CGLIB 动态代理的区别

JDK 动态代理和 CGLIB 动态代理的区别 JDK 动态代理和 CGLIB 动态代理都是在 Java 中实现动态代理的两种常见方式。它们各自有不同的特点和适用场景。下面详细介绍一下这两种动态代理的区别&#xff1a; 1. 代理机制 JDK 动态代理: 实现原理: JDK 动态代理基于 Java 的反射…...

SAP 和 Legacy 系统之间的平面文件集成,GUI_DOWNLOAD 的实战设计

很多 SAP 项目里,系统集成并不总是从 API、RFC、OData 或 Event Mesh 开始。相当多的老系统仍然依赖一个最朴素的接口形态,固定格式的文本文件。财务共享平台要一份物料清单,仓储系统要一份当天新增物料,历史的生产执行系统只认 .txt 或 .csv,这时 ABAP 报表把 SAP 表里的…...

Bilibili-Evolved:彻底改造你的B站体验!新手必看的个性化增强指南

Bilibili-Evolved&#xff1a;彻底改造你的B站体验&#xff01;新手必看的个性化增强指南 【免费下载链接】Bilibili-Evolved 强大的哔哩哔哩增强脚本 项目地址: https://gitcode.com/gh_mirrors/bi/Bilibili-Evolved 你是否厌倦了B站千篇一律的界面&#xff1f;是否觉得…...

伪装 Android 应用运营商计费欺诈的攻击机理与防御研究

摘要 2026 年 5 月&#xff0c;Dark Reading 与 Zimperium 披露一起针对马来西亚、泰国、罗马尼亚、克罗地亚等国 Android 用户的大规模运营商计费欺诈活动。攻击者以近 250 个伪装成热门应用的恶意程序为载体&#xff0c;通过读取 SIM 卡信息定向激活攻击流程&#xff0c;综合…...

wechatferry 高级技巧:如何实现AI驱动的智能对话机器人

wechatferry 高级技巧&#xff1a;如何实现AI驱动的智能对话机器人 【免费下载链接】wechatferry - 项目地址: https://gitcode.com/gh_mirrors/wec/wechatferry WechatFerry 是一款功能强大的微信机器人底层框架&#xff0c;通过 Node 生态下的第三方客户端实现&#x…...

注意力机制:多头注意力机制、分组查询注意力机制、多查询注意力机制理论+代码

文章目录导语1.注意力机制2.多头注意力机制3.多查询注意力机制4.分组查询注意力机制5.三者对比导语 注意力机制作为transformer体系中最核心的方法&#xff0c;是NLP、LLM等都绕不开的一部分&#xff0c;多头注意力机制是transformer模型提出的“基石”&#xff0c;分组查询注…...

vue3+vite+springboot路径配置:维护统一的baseUrl

提交表单&#xff1a;try…catch 捕获异常&#xff0c;如果校验失败&#xff0c;前台页面会有错误提示。 const submitForm async () > {try {await formRef.value.validate(); // 校验失败会抛出异常const submitData { ...formData };submitData.allowedSubmitTypes su…...

GEO优化的时间窗口期:从流量分发到语义占位的技术范式转移

过去几十年&#xff0c;互联网的信息检索逻辑建立在倒排索引与超链接分析的基础之上&#xff1a;用户输入关键词&#xff0c;搜索引擎通过爬虫抓取并返回链接列表&#xff0c;网站则通过SEO&#xff08;搜索引擎优化&#xff09;争夺SERP&#xff08;搜索结果页&#xff09;的排…...

C 语言通讯录(终版)|新手踩坑全总结 + 最终可运行代码博客简介

系列回顾 本系列三篇完整闭环&#xff1a; 第一篇&#xff08;基础版&#xff09;&#xff1a;从零实现增删查改 文件存储&#xff0c;踩遍新手所有坑&#xff08;格式符乱码、文件闪退、输入死循环&#xff09;&#xff1b;第二篇&#xff08;优化版&#xff09;&#xff1…...

计算机二级 WPS 文字题:样式调整考点 详细解析

计算机二级 WPS 文字题&#xff1a;样式调整考点 详细解析 这道题是WPS 文字 / Word 样式设置的高频必考题型&#xff0c;核心考点是「样式批量修改」和「分页控制」&#xff0c;我会把每一步的操作、考点和易错点都拆解清楚。 一、题目整体拆解 题目分为 3 个核心任务&#…...

C++位运算技巧应用

C位运算技巧应用位运算是直接操作二进制位的运算&#xff0c;具有极高的执行效率。掌握位运算技巧可以优化算法性能并实现紧凑的数据表示。基本位运算包括与、或、异或、取反和移位操作。#include #includevoid basic_bitwise_operations() { unsigned int a 0b1010; unsigned…...