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

相关推荐
傻乐u兔12 小时前
C语言进阶————指针4
c语言·开发语言
大模型玩家七七12 小时前
基于语义切分 vs 基于结构切分的实际差异
java·开发语言·数据库·安全·batch
历程里程碑12 小时前
Linux22 文件系统
linux·运维·c语言·开发语言·数据结构·c++·算法
恋猫de小郭12 小时前
Flutter Zero 是什么?它的出现有什么意义?为什么你需要了解下?
android·前端·flutter
牛奔13 小时前
Go 如何避免频繁抢占?
开发语言·后端·golang
寻星探路17 小时前
【深度长文】万字攻克网络原理:从 HTTP 报文解构到 HTTPS 终极加密逻辑
java·开发语言·网络·python·http·ai·https
崔庆才丨静觅18 小时前
hCaptcha 验证码图像识别 API 对接教程
前端
lly20240618 小时前
Bootstrap 警告框
开发语言
2601_9491465319 小时前
C语言语音通知接口接入教程:如何使用C语言直接调用语音预警API
c语言·开发语言
曹牧19 小时前
Spring Boot:如何测试Java Controller中的POST请求?
java·开发语言