前端实现点击复制功能---execCommand

复制代码
 copy(data) {
    //创建input元素节点
    const input = document.createElement('input')
    //传入需要复制的内容
    input.value = data 
    //插入一个input节点
    document.body.appendChild(input)
    //全选input框里面的内容
    input.select()
    //复制input框中选中的内容,Copy代表复制操作,还有剪切等操作,具体可参考文档链接
    document.execCommand('Copy')
    //移除input节点
    input.remove()
  }

PS:

execCommand会显示弃用,如果要使用,具体兼容性可参考如下链接:

document.execCommand - Web API 接口参考 | MDN (mozilla.org)

相关推荐
C++ 老炮儿的技术栈2 分钟前
什么是通信规约
开发语言·数据结构·c++·windows·算法·安全·链表
@大迁世界5 分钟前
TypeScript 的本质并非类型,而是信任
开发语言·前端·javascript·typescript·ecmascript
栗子叶10 分钟前
Java对象创建的过程
java·开发语言·jvm
GIS之路14 分钟前
GDAL 实现矢量裁剪
前端·python·信息可视化
是一个Bug17 分钟前
后端开发者视角的前端开发面试题清单(50道)
前端
Amumu1213819 分钟前
React面向组件编程
开发语言·前端·javascript
IT=>小脑虎20 分钟前
Python零基础衔接进阶知识点【详解版】
开发语言·人工智能·python
wjs202422 分钟前
C 标准库 - `<float.h>》详解
开发语言
五仁火烧26 分钟前
生产环境中配置了接口3000后,不能启动,改成8080后就可以
linux·网络·安全·vue
zfj32129 分钟前
CyclicBarrier、CountDownLatch、Semaphore 各自的作用和用法区别
java·开发语言·countdownlatch·semaphore·cyclicbarrier