js如何实现一键复制

原生JS监听复制事件，更改复制的内容，或者在复制内容后面追加参数

原生 JS 监听 复制 copy 事件，追加版权信息：

<div class="empty-font">选中这一段文字，点击 ctrl+C 或 者右键选择复制</div>
<script type="text/javascript">
    //监听整个页面的 copy 事件
    document.addEventListener'copy',functione){
        // clipboardData 对象是为通过编辑菜单、快捷菜单和快捷键执行的编辑操作所保留的，也就是你复制或者剪切内容
        let clipboardData = e.clipboardData || window.clipboardData;
        // 如果 未复制或者未剪切，直接 return 
        if!clipboardData) return ;
        // Selection 对象 表示用户选择的文本范围或光标的当前位置。
        // 声明一个变量接收 -- 用户输入的剪切或者复制的文本转化为字符串
        let text = window.getSelection).toString);
        iftext){
            // 如果文本存在，首先取消默认行为
            e.preventDefault);
            // 通过调用 clipboardData 对象的 setDataformat,data) 方法，设置相关文本 
            // format 一个 DOMString 类型 表示要添加到 drag object 的拖动数据的类型
            // data 一个 DOMString 表示要添加到 drag object 的数据
            clipboardData.setData'text/plain', text + '
这是追加的版权内容')
        }
    })
</script>

原生JS控制按钮点击复制自定义内容，复制想要让复制的内容

原生 JS 点击按钮复制自定义内容：

<button type="button" onclick="copyTxt'这是复制的内容')">复制内容</button>
<script type="text/javascript">
    //原生js实现复制内容到剪切板，兼容pc、移动端（支持Safari浏览器）
    function copyTxttext){
        iftypeof document.execCommand!=="function"){
            alert"复制失败，请长按复制");
            return;
        }
        var dom = document.createElement"textarea");
        dom.value = text;
        dom.setAttribute'style', 'display: block; 1px;height: 1px;');
        document.body.appendChilddom);
        dom.select);
        var result = document.execCommand'copy');
        document.body.removeChilddom);
        if result) {
            alert"复制成功");
            return;
        }
        iftypeof document.createRange!=="function"){
            alert"复制失败，请长按复制");
            return;
        }
        var range = document.createRange);
        var div=document.createElement'div');
        div.innerHTML=text;
        div.setAttribute'style', 'height: 1px;fontSize: 1px;overflow: hidden;');
        document.body.appendChilddiv);
        range.selectNodediv);
        const selection = window.getSelection);
        if selection.rangeCount > 0){
            selection.removeAllRanges);
        }
        selection.addRangerange);
        document.execCommand'copy');
        alert"复制成功")
    }
</script>

参考

JavaScript实现一键复制到剪贴板