js复制文本到剪切板（js原生写法）

最新推荐文章于 2023-05-24 12:53:35 发布

七里香的秋刀鱼

最新推荐文章于 2023-05-24 12:53:35 发布

阅读量260

点赞数

分类专栏：前端文章标签： js javascript

本文链接：https://blog.csdn.net/who__care/article/details/118708835

版权

前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

本文介绍了如何使用JavaScript的DOM API来实现文本复制功能，通过创建input元素、设置属性、选择并执行copy命令，展示了基础的前端开发技巧。点击按钮即可复制指定内容，适用于教育和开发者日常实践。

摘要由CSDN通过智能技术生成

document.execCommand ——js 原生 copy

<template>
	<el-button type="primary" @click="copy" >复制</el-button>
</template>
...
...
<script>
export default {
	methods: {
	    // js 原生 copy
        copy(){
            var input = document.createElement('input');
            input.setAttribute('readonly', 'readonly');
            input.setAttribute('value', this.address);
            document.body.appendChild(input);
            input.select();
            input.setSelectionRange(0, 9999);
            document.execCommand('Copy');
            if(document.execCommand('Copy')) {
                this.$message({
                    type: 'success',
                    message: '复制成功!'
                });
            }
            document.body.removeChild(input);	//单页应用务必加上
        }
	}
}