原生js实现文本复制功能

最新推荐文章于 2025-06-16 17:15:54 发布

全太阳

最新推荐文章于 2025-06-16 17:15:54 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签： js复制文本

本文链接：https://blog.youkuaiyun.com/qq_31263935/article/details/83897855

javascript 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一个简单的HTML页面，其中包含一个按钮，点击该按钮可以复制页面上的文本到剪贴板。此功能通过JavaScript实现，利用了document.execCommand('Copy')方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

废话不多说，直接上代码

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    </head>

    <body>
        <div>欢迎光临 9527</div>
        <button class="btn" onclick="copyThat()">Copy</button>

        <script>
            function copyThat() {
                var text = document.getElementsByTagName('div')[0].innerText;
                var eleInput = document.createElement('input');
                eleInput.value = text;
                document.body.appendChild(eleInput);
                eleInput.style.display = 'none';
                eleInput.select();
                document.execCommand("Copy")
            }
        </script>
    </body>

</html>