方法:
navigator.clipboard.writeText('message')
该方法更为简单实用,且兼容性好,废话不多说,直接上代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<div class="message">这段文本将被复制</div>
<button class="btn">点击复制</button>
<script>
const copyEl = document.querySelector('.message')
const btnEl = document.querySelector('.btn')
btnEl.addEventListener('click', () => {
// 该方法可以写入特定字符串到操作系统的剪切板,并返回一个Promise
// 一旦剪贴板的内容被更新,它就会被解析。如果调用者没有写入剪贴板的权限,则拒绝写入剪切板(reject)
navigator.clipboard
.writeText(copyEl.textContent)
.then(() => {
console.log('复制成功')
})
.catch(() => {
console.log('复制失败')
})
})
</script>
</body>
</html>
该方法可以写入特定字符串到操作系统的剪切板,并返回一个Promise,复制成功调用resolve,复制失败调用reject,比方法一更方便快捷。选他就完事了。