纯js实现网页内容复制后自动追加自定义内容

JS代码
来源：站三界导航
100阅读
2022-06-27

不少网站技术或者博客上有这样的处理，当我们复制代码的时候，会自动加上一段本信息版权为XXXX，这是怎么实现的呢？

其实实现的方式很简单，可以在我的网站页面上绑定一个copy事件，当你复制文章内容的时候，自动在剪切板文字后面加上一段版权声明。

既然有的网站已经添加了，也可以手动删除，其实意义不是很大，但是作为技术人员大家都是靠代码技能吃饭的，可以体会到写代码的不易，相信一定会尊重知识劳动成果，保留出处等版权信息的。

效果示例：

代码示例：

<script>
    // 监听整个网页的copy(复制)事件
  document.addEventListener('copy', function (event) {
  // clipboardData 对象是为通过编辑菜单、快捷菜单和快捷键执行的编辑操作所保留的，也就是你复制或者剪切内容
    let clipboardData = event.clipboardData || window.clipboardData;
    // 如果未复制或者未剪切，则return出去
    if (!clipboardData) { return; }
    // Selection 对象，表示用户选择的文本范围或光标的当前位置。
    //     声明一个变量接收 -- 用户输入的剪切或者复制的文本转化为字符串
    let text = window.getSelection().toString();
    if (text) {
      // 如果文本存在，首先取消文本的默认事件
      event.preventDefault();
      // 通过调用常clipboardData对象的 setData(format, data) 方法；来设置相关文本
 
      // setData(format, data);参数
      // format
      // 一个DOMString 表示要添加到 drag object的拖动数据的类型。
      // data
      // 一个 DOMString表示要添加到 drag object的数据。
      clipboardData.setData('text/plain', text   '\n\n张无忌 版权所有');
    }
  });
</script>

本文来自投稿，不代表站三界导航立场，如若转载，请注明出处：https://www.zhansanjie.com/article/details/8911.html

1、本文系转载，版权归原作者所有，旨在传递信息，不代表看本站的观点和立场。

2、本站仅提供信息发布平台，不承担相关法律责任。

3、若侵犯您的版权或隐私，请联系本站管理员删除。

4、本文由会员转载自互联网，如果您是文章原创作者，请联系本站注明您的版权信息。

上一篇： php获取来源地址判断搜索引擎最全方法

下一篇： tp5查询当天数据、分组查询当天数据