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

clipboard

clipboard

现代复制到剪贴板。无闪光。只有 3kb 的 gzip 压缩。

安装

npm install clipboard --save

第三方cdn提供商

<script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js"></script>

使用

data-clipboard-target="#foo" //从其他元素复制文本data-clipboard-action="cut" // 从其他元素剪切或者复制文本 copy, cut只适用于 input textarea标签

代码展示

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><button style="background-color: red;" class="btn" data-clipboard-target="#foo" data-clipboard-action="copy">你是最棒的实施肯222定会觉得可能</button><button id="foo">我是小胖哦</button><script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js"></script><script>let btn = document.querySelector('.btn');btn.addEventListener('click', function () {let clipboard = new ClipboardJS('.btn');clipboard.on('success', function (e) {console.info('Action:', e.action);console.info('Text:', e.text);console.info('Trigger:', e.trigger);e.clearSelection();});});</script>
</body></html>

成功展示

在这里插入图片描述

相关文章:

clipboard

clipboard 现代复制到剪贴板。无闪光。只有 3kb 的 gzip 压缩。 安装 npm install clipboard --save第三方cdn提供商 <script src"https://cdn.jsdelivr.net/npm/clipboard2.0.11/dist/clipboard.min.js"></script>使用 data-clipboard-target"…...

【JavaEE进阶】 JavaScript

本节⽬标 了解什么是JavaScript, 学习JavaScript的常⻅操作, 以及使⽤JQuery完成简单的⻚⾯元素操作. 一. 初识 JavaScript 1.JavaScript 是什么 JavaScript (简称 JS), 是⼀个脚本语⾔, 解释型或即时编译型的编程语⾔. 虽然它是作为开发Web⻚⾯的脚本语⾔⽽出名&#xff0c;…...

python程序的编写以及发布(形象类比)

最近重新接触python&#xff0c;本人之前对于python的虚拟环境&#xff0c;安装包比较比较迷惑&#xff0c;这里给出一个具象的理解。可以将 Python 程序运行的过程类比成一次 做菜的过程&#xff0c;从准备食材到最后出锅。以下是具体的类比步骤&#xff1a; 1. 安装 Python 环…...

游戏引擎学习第20天

视频参考:https://www.bilibili.com/video/BV1VkBCYmExt 解释 off-by-one 错误 从演讲者的视角&#xff1a;对代码问题的剖析与修复过程 问题的起因 演讲者提到&#xff0c;他可能无意中在代码中造成了一个错误&#xff0c;这与“调试时间标记索引”有关。他发现了一个逻辑问题…...

大数据面试题每日练习--HDFS是如何工作的?

HDFS&#xff08;Hadoop Distributed File System&#xff09;是一个分布式文件系统&#xff0c;设计用于存储非常大的文件。它的主要工作原理如下&#xff1a; NameNode&#xff1a;管理文件系统的命名空间&#xff0c;维护文件目录树和文件元数据信息。NameNode记录每个文件…...

高质量 JavaScript

高质量的 JavaScript 非常重要。它能够提升代码的可读性&#xff0c;让其他开发者可以轻松理解代码意图&#xff0c;减少沟通成本和维护难度。同时&#xff0c;合理的代码结构和正确的语法运用能够避免许多潜在的错误和性能问题&#xff0c;例如通过正确处理异步操作来防止程序…...

小白投资理财 - 解读威廉分形指标 Williams Fractals

小白投资理财 - 解读威廉分形指标 Williams Fractals WF 指标WF 的使用止损支撑和阻力 WF 缺点WF 组合使用WF EMAWF 和趋势线 WF 周期设定总结 你有看过这种情况吗&#xff1f;它能够准确的让你知道高点和低点&#xff0c;而且每次都能够完美的预测到反转的信号&#xff0c;其…...

五天SpringCloud计划——DAY2之使用Docker完成项目的部署

一、引言 刚刚学完了Docker的使用&#xff0c;现在知识在脑子里面还是热乎的&#xff0c;是时候把它总结一下了。 现在的我认为Docker时一个部署项目的工具(不知道是不是真的),相比于我以前使用宝塔面板部署项目&#xff0c;使用Docker更能让我看到代码之美&#xff0c;怎么一…...

HarmonyOS4+NEXT星河版入门与项目实战(11)------Button组件

文章目录 1、控件图解2、案例实现1、代码实现2、代码解释3、运行效果4、总结1、控件图解 这里我们用一张完整的图来汇整 Button 的用法格式、属性和事件,如下所示: 按钮默认类型就是胶囊类型。 2、案例实现 这里我们实现一个根据放大和缩小按钮来改变图片大小的功能。 功…...

oracle的静态注册和动态注册

oracle的静态注册和动态注册 静态注册&#xff1a; 静态注册 : 指将实例的相关信息手动告知 listener 侦 听 器 &#xff0c; 可以使用netmgr,netca,oem 以及直接 vi listener.ora 文件来实现静态注册&#xff0c;在动态注册不稳定时使用&#xff0c;特点是&#xff1a;稳定&…...

【系统架构设计师】真题论文: 论软件可靠性设计技术的应用(包括解题思路和素材)

更多内容请见: 备考系统架构设计师-专栏介绍和目录 文章目录 真题题目(2013年 试题3)解题思路论文素材参考软件可靠性设计技术概念主要的软件可靠性设计技术软件可靠性设计技术的应用流程真题题目(2013年 试题3) 随着软件的日益普及,系统中软件成分不断增加,使得系统对…...

网络运输层之(1)TCP连接管理

网络运输层之(1)TCP连接管理 Author: Once Day Date: 2024年10月22日 一位热衷于Linux学习和开发的菜鸟&#xff0c;试图谱写一场冒险之旅&#xff0c;也许终点只是一场白日梦… 漫漫长路&#xff0c;有人对你微笑过嘛… 全系列文章可参考专栏: 通信网络技术_Once-Day的博客…...

基于阿里云服务器部署静态的website

目录 一&#xff1a;创建服务器实例并connect 二&#xff1a;本地文件和服务器share 三&#xff1a;关于IIS服务器的安装预配置 四&#xff1a;设置安全组 五&#xff1a;建站流程 六&#xff1a;关于备案 一&#xff1a;创建服务器实例并connect 创建好的服务器实例在云…...

Git项目管理

Git项目管理 分区概念&#xff1a;创建本地仓库查看当前仓库的状态工作区添加到暂存区暂存区恢复到工作区工作区提交到本地仓库查看提交日志版本回滚查看版本变更的所有记录分支查看分支创建分支删除分支切换分支合并分支 冲突解决HEAD指针分支使用的一般规范masterdevelopfeat…...

实践指南:EdgeOne与HAI的梦幻联动

在当今快速发展的数字时代&#xff0c;安全和速度已成为网络服务的基石。EdgeOne&#xff0c;作为腾讯云提供的边缘安全加速平台&#xff0c;以其全球部署的节点和强大的安全防护功能&#xff0c;为用户提供了稳定而高效的网络体验。而HAI&#xff08;HyperApplicationInventor…...

OmniDiskSweeper :一款专为 macOS 设计的磁盘使用分析工具

OmniDiskSweeper 是一款专为 macOS 设计的磁盘使用分析工具&#xff0c;由 The Omni Group 开发。它的主要目的是帮助用户可视化磁盘上的文件和文件夹&#xff0c;并找出占用大量空间的文件&#xff0c;从而帮助用户释放磁盘空间。 OmniDiskSweeper 的特点包括&#xff1a; 简…...

【Git】:Git基本操作

目录 创建、配置本地仓库 创建本地仓库 配置本地仓库 认识工作区、暂存区、版本库 修改文件 版本回退 撤销修改 删除文件 创建、配置本地仓库 创建本地仓库 我们通常可以通过以下两种方式之一获取 Git 存储库&#xff1a; 自己在本地目录创建一个本地仓库 从其它服务…...

C++设计模式:建造者模式(Builder) 房屋建造案例

什么是建造者模式&#xff1f; 建造者模式是一种创建型设计模式&#xff0c;它用于一步步地构建一个复杂对象&#xff0c;同时将对象的构建过程与它的表示分离开。简单来说&#xff1a; 它将复杂对象的“建造步骤”分成多部分&#xff0c;让我们可以灵活地控制这些步骤。通过…...

由于centos停更,yum、docker等不支持,采用阿里云仓库搭建K8S

一&#xff1a;准备 服务器信息主机名IP地址Centos7.9node1-master192.168.35.130Centos7.9node2192.168.35.131 # 查看系统版本 cat /etc/centos-release # 查看内核版本 uname -sr二&#xff1a;服务器前置操作 每个节点都需要操作 #使用 hostnamectl set-hostname设置主机…...

cocos creator 3.8 一些简单的操作技巧,材质的创建 1

这是一个飞机的3D模型与贴图 导入到cocos中&#xff0c;法线模型文件中已经包含了mesh、material、prefab&#xff0c;也就是模型、材质与预制。界面上创建一个空节点Plane&#xff0c;将模型直接拖入到Plane下。新建材质如图下 Effect属性选择builtin-unlit&#xff0c;不需…...

下载安装Android Studio

&#xff08;一&#xff09;Android Studio下载地址 https://developer.android.google.cn/studio 滑动到 点击下载文档 打开新网页 切换到english ![](https://i-blog.csdnimg.cn/direct/b7052b434f9d4418b9d56c66cdd59fae.png 等待一会&#xff0c;出现 点同意后&#xff0…...

查看浏览器的请求头

爬虫时用到了请求头&#xff0c;虽然可以用网上公开的&#xff0c;但是还是想了解一下本机浏览器的。以 Edge 为例&#xff0c;其余浏览器通用。 打开浏览器任一网页&#xff0c;按F12打开DevTools&#xff1b;或鼠标右键&#xff0c;选择“检查”。首次打开界面应该显示在网页…...

C++异常: cv::Exception 解决

原因是C中文件路径错误&#xff0c;\ 号在字符串中表示转义字符&#xff0c;"C:\Users\14421\Desktop\123.png" "C:Usersd21DesktopS.png" &#xff0c;所以应该改为 C:\\Users\\14421\\Desktop\\123.png 或者 C:/Users/14421/Desktop/123.png 即可解决问…...

基于YOLOv8深度学习的人体姿态摔倒检测与语音报警系统(PyQt5界面+数据集+训练代码)

随着人口老龄化进程的加速&#xff0c;摔倒事故逐渐成为威胁老年人健康和安全的主要问题之一。研究表明&#xff0c;摔倒不仅可能导致老年人骨折、头部受伤等严重的身体损伤&#xff0c;还可能引发心理恐惧和行动能力下降&#xff0c;从而降低其生活质量和独立性。如何快速、准…...

C++特殊类设计(不能被拷贝的类、只能在堆上创建对象的类、不能被继承的类、单例模式)

C特殊类设计 在实际应用中&#xff0c;可能需要设计一些特殊的类对象&#xff0c;如不能被拷贝的类、只能在堆上创建对象的类、只能在栈上创建对象的类、不能被继承的类、只能创建一个对象的类&#xff08;单例模式&#xff09;。 1. 不能被拷贝的类 拷贝只会发生在两个场景…...

Javaweb前端HTML css 整体布局

最后一个是线条颜色 盒子&#xff0c;整体还是300&#xff0c;400...

数据集-目标检测系列- 花卉 鸡蛋花 检测数据集 frangipani >> DataBall

数据集-目标检测系列- 花卉 鸡蛋花 检测数据集 frangipani >> DataBall DataBall 助力快速掌握数据集的信息和使用方式&#xff0c;会员享有 百种数据集&#xff0c;持续增加中。 贵在坚持&#xff01; 数据样例项目地址&#xff1a; * 相关项目 1&#xff09;数据集…...

【从零开始的LeetCode-算法】3297. 统计重新排列后包含另一个字符串的子字符串数目 I

给你两个字符串 word1 和 word2 。 如果一个字符串 x 重新排列后&#xff0c;word2 是重排字符串的 前缀&#xff0c;那么我们称字符串 x 是 合法的 。 请你返回 word1 中 合法 子字符串的数目。 示例 1&#xff1a; 输入&#xff1a;word1 "bcca", word2 "…...

【Redis_Day5】String类型

【Redis_Day5】String类型 String操作String的命令set和get&#xff1a;设置、获取键值对mset和mget&#xff1a;批量设置、获取键值对setnx/setex/psetexincr和incrby&#xff1a;对字符串进行加操作decr/decrby&#xff1a;对字符串进行减操作incrbyfloat&#xff1a;浮点数加…...

【CVE-2024-48694】OfficeWeb365 SaveDraw

漏洞描述 OfficeWeb365 v.8.6.1.0和v7.18.23.0中的文件上传漏洞允许远程攻击者通过pw/savedraw组件执行任意代码。 影响版本&#xff1a; V8.6.1.0&#xff1b; V7.18.23.0 网络测绘 “OfficeWeb365” 漏洞信息 POST /PW/SaveDraw?path../../Content/img&idx6.ashx H…...

leecode134.加油站

一开始想的是总体上加油量超过耗油量那么就一定能找到一个起始点可以跑一圈&#xff0c;这个起始点选择补充油量与耗油量差值最大的那gas个点&#xff0c;但是我没仔细审题&#xff0c;这个起始点是索引逐次1绕一圈而不是随便选择&#xff0c;gas[5,8,2,8]&#xff0c;cost[6,5…...

分层架构 IM 系统之 Entry 部署模式

在前面的一篇技术短文&#xff08;分层架构 IM 系统之架构解读&#xff09;中&#xff0c;对【分层架构】进行了详细分析&#xff1b;今天我们聊一下【入口层】Entry 的部署模式。 Entry 作为 IM 系统整个后端集群的入口&#xff0c;直接与客户端建立 TCP 长连接&#xff0c;E…...

【Java从入门到放弃 之 多线程 四】

多线程 四 多线程 四读写锁的使用代码演示 乐观锁的使用代码演示 信号量代码演示 倒计时门禁代码演示 循环栅栏Condition详解代码案例 多线程 四 读写锁的使用 上一篇我们介绍到了可重入锁&#xff0c;现在我们来介绍读写锁。实际上&#xff0c;使用可重入锁的时候我们就可以…...

OpenHarmony-3.驱动HDF

OpenHarmony HDF 框架 1.OpenHarmony HDF 框架概述 OpenHarmony驱动子系统采用C面向对象编程模型构建&#xff0c;通过平台解耦、内核解耦&#xff0c;兼容不同内核&#xff0c;提供了归一化的驱动平台底座&#xff0c;旨在为开发者提供更精准、更高效的开发环境&#xff0c;力…...

udp_socket

文章目录 UDP服务器封装系统调用socketbind系统调用bzero结构体清0sin_family端口号ip地址inet_addrrecvfromsendto 新指令 netstat -naup (-nlup)包装器 的两种类型重命名方式包装器使用统一可调用类型 关键字 typedef 类型重命名系统调用popen关于inet_ntoa UDP服务器封装 系…...

Java NIO 核心知识总结

在学习 NIO 之前&#xff0c;需要先了解一下计算机 I/O 模型的基础理论知识。还不了解的话&#xff0c;可以参考我写的这篇文章&#xff1a;Java IO 模型详解。 一、NIO 简介 在传统的 Java I/O 模型&#xff08;BIO&#xff09;中&#xff0c;I/O 操作是以阻塞的方式进行的。…...

音频信号采集前端电路分析

音频信号采集前端电路 一、实验要求 要求设计一个声音采集系统 信号幅度&#xff1a;0.1mVpp到1Vpp 信号频率&#xff1a;100Hz到16KHz 搭建一个带通滤波器&#xff0c;滤除高频和低频部分 ADC采用套件中的AD7920&#xff0c;转换率设定为96Ksps &#xff1b;96*161536 …...

PyTorch基础学习03_数学运算自动微分

目录 一、数学运算 1、基本操作 2、三角函数 3、统计学函数 二、保存和加载 三、并行化 四、自动微分 1、相关概念 2、计算梯度 1.标量梯度计算 2.向量梯度计算 3.多标量梯度计算 4.多向量梯度计算 5.矩阵梯度计算 3、梯度上下文控制 1、梯度控制 2、梯度更新…...

HarmonyOS4+NEXT星河版入门与项目实战(16)------ 状态管理 @State(页面数据刷新与渲染)

文章目录 1、@State装饰器2、视图渲染演示1、无嵌套的对象属性值变化时可以触发页面渲染2、嵌套对象的嵌套属性值变化时不能够触发页面刷新渲染3、数组中对象的属性值变化时不能触发页面刷新渲染3、总结1、@State装饰器 2、视图渲染演示 常规的 string、number 这里就不演示了…...

K8s 一键部署 MongoDB 的 Replica-Set 和 MongoDB-Express

什么是 MongoDB 副本集&#xff1f; MongoDB 副本集&#xff08;Replica-Set&#xff09;是一个分布式数据库系统&#xff0c;它包含一个主节点和多个从节点。主节点负责处理所有写操作&#xff0c;从节点用于读取数据。当主节点发生故障时&#xff0c;从节点可以自动选举一个…...

React Native的界面与交互

React Native (RN) 是一个由 Facebook 开发的开源框架&#xff0c;用于构建跨平台的移动应用程序。它允许开发者使用 JavaScript 和 React 来创建原生 iOS 和 Android 应用。RN 的出现极大地简化了移动应用的开发过程&#xff0c;使得开发者可以更快速、更高效地构建高质量的应…...

【探寻密码的奥秘】-001:解开密码的神秘面纱

目录 1、密码学概述1.1、概念1.2、目的1.3、应用场景 2、密码学的历史2.1、第一时期&#xff1a;古代密码时代2.2、第二时期&#xff1a;机械密码时代2.3、第三时期&#xff1a;信息密码时代2.4、第四时期&#xff1a;现代密码时代 3、密码学的基本概念3.1、一般通信系统3.2、保…...

C++实现Raft算法

概念部分 Raft 算法是一种用于实现分布式系统中的一致性的算法。它是为了容易理解而设计的&#xff0c;其目标是实现和 Paxos 算法相同的功能&#xff0c;但更加容易理解和实现。Raft 算法在分布式系统中尤其关键&#xff0c;因为它帮助系统中的多个节点就其数据的准确状态达成…...

FastApi教程

FastAPI框架 fastapi&#xff0c;一个用于构建 API 的现代、快速&#xff08;高性能&#xff09;的web框架。 fastapi是建立在Starlette和Pydantic基础上的&#xff0c;Pydantic是一个基于Python类型提示来定义数据验证、序列化和文档的库。Starlette是一种轻量级的ASGI框架/…...

HTB:WifineticTwo[WriteUP]

目录 连接至HTB服务器并启动靶机 信息搜集 使用rustscan对靶机TCP端口进行开放扫描 使用nmap对靶机开放端口进行脚本、服务扫描 使用curl访问靶机8080端口 使用浏览器直接访问/login路径 漏洞利用 使用searchsploit搜索该WebAPP漏洞 Payload USER_FLAG&#xff1a;bb…...

ubuntu16.04在ros使用USB摄像头-解决could not open /dev/video0问题

首先检查摄像头 lsusb 安装 uvc camera 功能包 sudo apt-get install ros-indigo-uvc-camera 安装 image 相关功能包 sudo apt-get install ros-kinetic-image-* sudo apt-get install ros-kinetic-rqt-image-view运行 uvc_camera 节点 首先输入roscore 然后另外开一个终端输入…...

大模型专栏--什么是大模型

什么是大模型 来自 chatGPT 的回答&#xff1a; “大模型”通常指的是在机器学习和深度学习领域&#xff0c;尤其是自然语言处理&#xff08;NLP&#xff09;和计算机视觉&#xff08;CV&#xff09;中&#xff0c;具有大量参数和复杂结构的模型。这些模型通常需要大量的数据和…...

LLaMA-Mesh: Unifying 3D Mesh Generation with Language Models 论文解读

目录 一、概述 二、相关工作 1、LLMs到多模态 2、3D对象生成 3、自回归的Mesh生成 三、LLaMA-Mesh 1、3D表示 2、预训练模型 3、有监督的微调数据集 4、数据集演示 四、实验 1、生成的多样性 2、不同模型text-to-Mesh的比较 3、通用语境的评估 一、概述 该论文首…...

golang实现TCP服务器与客户端的断线自动重连功能

1.服务端 2.客户端 生成服务端口程序: 生成客户端程序: 测试断线重连: 初始连接成功...

项目实战:基于深度学习的人脸表情识别系统设计与实现

大家好&#xff0c;人脸表情识别是计算机视觉领域中的一个重要研究方向&#xff0c;它涉及到对人类情感状态的理解和分析。随着深度学习技术的发展&#xff0c;基于深度学习的人脸表情识别系统因其高精度和强大的特征学习能力而受到广泛关注。本文旨在探讨基于深度学习的人脸表…...