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

相关推荐
cany1000几秒前
C++ -- 泛型编程
java·开发语言·c++
sayamber2 分钟前
vLLM 容器化部署实战:如何在云服务器上跑起高并发大模型推理服务
前端
LIO2 分钟前
Pinia 极简指南:Vue 3 官方状态管理库
前端·vue.js
格林威3 分钟前
面阵相机 vs 线阵相机:堡盟与海康相机选型差异全解析 附C++ 实战演示
开发语言·c++·人工智能·数码相机·计算机视觉·视觉检测·工业相机
时空系30 分钟前
第7篇功能——打造你的工具箱 python中文编程
开发语言·python·ai编程
shughui31 分钟前
2026最新JDK版本选择及下载安装详细图文教程【windows、mac附安装包】
java·linux·开发语言·windows·jdk·mac
Wenzar_31 分钟前
# D3.js实战进阶:从基础图表到交互式数据仪表盘的全流程构建在现代前端开发中,**数据可视化已成为提升用户体验的核心能力之一
java·javascript·python·信息可视化·ux
燐妤33 分钟前
前端HTML编程2:深入学习表单与表格
前端·学习·html5
菜鸟小码34 分钟前
MapReduce 编程模型详解:Mapper、Reducer、Driver 三大核心组件
大数据·javascript·mapreduce
AI玫瑰助手35 分钟前
Python基础:集合的定义、去重与交并差运算
开发语言·python·信息可视化