前端实现点击复制功能---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)

相关推荐
前端Hardy几秒前
Electrobun 正式登场:仅 12MB,JS 桌面开发迎来轻量化新方案!
前端·javascript·electron
树上有只程序猿几秒前
新世界的入场券,不再只发给程序员
前端·人工智能
confiself10 分钟前
deer-flow前端分析
前端
刘宇琪11 分钟前
Vite 生产环境代码分割与懒加载优化
前端
叫我一声阿雷吧12 分钟前
JS 入门通关手册(20):构造函数与原型:JS 面向对象第一课
开发语言·javascript·前端开发·前端面试·构造函数·js进阶·js面向对象
2501_9454235413 分钟前
C++与Rust交互编程
开发语言·c++·算法
小王不爱笑13214 分钟前
Java Set 集合全家桶:HashSet、LinkedHashSet、TreeSet 详解与实战
java·开发语言
早點睡39017 分钟前
ReactNative项目Openharmony三方库集成实战:@react-native-ohos/react-native-image-picker
javascript·react native·react.js
恋猫de小郭23 分钟前
让你的 OpenClaw 带你学习,清华开源 AI 私人导师 OpenMAIC
前端·人工智能·ai编程
code_whiter28 分钟前
C++2(类与对象上篇)
开发语言·c++