js将文本内容复制到剪切板

263 阅读1分钟

一、原生js实现,通过创建一个临时的DOM元素来复制内容到剪切板

let input = document.createElement("textarea"); // 创建textarea对象
input.value = yourText; // 设置要复制的内容
document.body.appendChild(input); // 添加一个临时实例
input.select(); // 选取元素
document.execCommand("Copy"); // 执行复制
document.body.removeChild(input); // 删除临时实例

使用这种方法最好是创建一个textarea元素,如果使用input会忽略换行,

二、使用navigator.clipboard

navigator.clipboard.writeText(yourText)

注意,这种方式只能在localhost或者有https的网站使用。之所以会有这个限制,是因为浏览器会启用安全上下文(Secure contexts)来限制一些Web Api的访问,以防止中间人攻击