js实现复制功能

document.execCommand()方法

参考地址

• 这个方法有个限制, 只能复制可编辑区域。
• 所以我们创建一个<input>或<textarea>将他们隐藏
• 将我们所需的值给了<input>或<textarea>
• 然后调用copy函数

html

    <textarea id="input">用来复制课ID</textarea>
    <div id='cont'>复制我啊复制我啊</div>
    <button id="btn">点我复制</button>

css

    #input {
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        z-index: -10;
    }

JavaScript

    const btn = document.querySelector('#btn');
    const cont = document.querySelector('#cont');
    btn.addEventListener('click', () => {
        const input = document.querySelector('#input');
        input.value = cont.innerHTML;
        input.select();                          //选中
        if (document.execCommand('copy')) {
            document.execCommand('copy');       //复制
            console.log('复制成功');
        }
    })