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

相关推荐
海上彼尚几秒前
React18+快速入门 - 1.响应式机制之 useState 和 useReducer
前端·javascript·react.js
Chennnng几秒前
键盘参数选购
前端·css·计算机外设
番石榴AI1 分钟前
纯 Java 实现的 OCR 推理系统:JiaJiaOCR,告别 exe/dll 依赖!
java·开发语言·ocr
小c君tt2 分钟前
FFmpeg在QT中的使用3
开发语言·qt·ffmpeg
Nan_Shu_6142 分钟前
熟悉RuoYi-Vue-Plus-前端 (3)
前端·javascript·vue.js
b***74885 分钟前
前端技术的加速变革:从工程体系到智能化时代的全栈重构
前端·重构
NOVAnet20235 分钟前
React曝“炸弹级”漏洞(CVE-2025-55182),CVSS 10.0分!已有在野利用,企业如何紧急防御
前端·react.js·网络安全·前端框架
鹏多多6 分钟前
Flutter自定义日历table_calendar完全指南+案例
android·前端·flutter
2401_860494707 分钟前
在React Native中实现一个Popover(气泡弹出框)组件,用于展示一些相关的信息,如提示、警告、错误等,同时支持自定义内容和位置
javascript·react native·react.js·ecmascript·harmonyos
侦探观察7 分钟前
南非女性旅游绑架风险分析及防范措施
android·大数据·开发语言·百度·网络安全·旅游