Html中用oncopy事件实现别人复制文章内容时自动追加版权信息

bg

摘要:现在很多网站都有复制网页内容自动添加版权信息,俗称小尾巴,比如:知乎,简书,CSDN等经过查找和测试发现此代码真实有效,利用的是javascript的oncopy事件

源代码如下:

function setClipboardText(event){
    event.preventDefault();//阻止元素发生默认的行为(例如,当点击提交按钮时阻止对表单的提交)。
    var node = document.createElement('div');
    //对documentfragment不熟,不知道怎么获取里面的内容,用了一个比较笨的方式
    node.appendChild(window.getSelection().getRangeAt(0).cloneContents());
    //getRangeAt(0)返回对基于零的数字索引与传递参数匹配的选择对象中的范围的引用。对于连续选择,参数应为零。
    var htmlData = '<div>'
        + node.innerHTML
        + '<br /><br />————————————————<br />'
        + '版权声明:本文为博主「nowfitness」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。<br />'
        + '原文链接:'+location.href
        + '</div>';
    var textData = window.getSelection().getRangeAt(0)
        + '\n\n————————————————\n'
        + '版权声明:本文为博主「nowfitness」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。\n'
        + '原文链接: '+location.href;
    if(event.clipboardData){
        event.clipboardData.setData("text/html", htmlData);
        //setData(剪贴板格式, 数据) 给剪贴板赋予指定格式的数据。返回 true 表示操作成功。
        event.clipboardData.setData("text/plain",textData);
    }
    else if(window.clipboardData){ //window.clipboardData的作用是在页面上将需要的东西复制到剪贴板上,提供了对于预定义的剪贴板格式的访问,以便在编辑操作中使用。
        return window.clipboardData.setData("text", textData);
    }
};

document.addEventListener('copy',function(e){
    setClipboardText(e);
});

参考资料:https://segmentfault.com/q/1010000003986612/a-1020000003994492

相关推荐

发表评论

邮箱地址不会被公开。 必填项已用*标注

微信扫一扫

微信扫一扫

微信扫一扫,分享到朋友圈

Html中用oncopy事件实现别人复制文章内容时自动追加版权信息
嘿!有什么能帮到您的吗?
返回顶部

显示

忘记密码?

显示

显示

获取验证码

Close