完整网页代码|移动端/pc端实现点击复制功能(如何复制网页的代码)

时间:2021-03-09 14:38:29   阅读:1638
<!DOCTYPE html><html><head lang="en">
    <meta charset="UTF-8">
    <meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0' />
    <title></title>
    <style>
        body{
            padding: 20px;
            text-align: center;
        }
        .copytxt{
            opacity: 0;/*不可以用display:none和 visibility: hidden;*/
        }    </style></head><body><a href="javascript:;" onclick="copyUrl()">点我复制</a><span class="copytxt"></span><script>
    function copyUrl(){
        document.getElementsByClassName("copytxt")[0].innerText = "http://www.zshao.vip";
        const range = document.createRange();
        range.selectNode(document.querySelector(".copytxt"));
        const selection = window.getSelection();
        if(selection.rangeCount > 0) selection.removeAllRanges();
        selection.addRange(range);
        document.execCommand('Copy');
        alert("复制成功");
    }</script></body></html>

点击运行,可以测试

完整网页代码|移动端/pc端实现点击复制功能(如何复制网页的代码)

上一篇:完整网页代码|qq跳转打开浏览器(qq打开网站跳转浏览器代码)

下一篇:完整网页代码|结束倒计时(网页设计倒计时代码)

网友评论