copy =() => {
const dom = document.getElementById(`collect-text-${t.Id}`)
const selection = window.getSelection()
const range = document.createRange() if (!dom || !selection || !range) return // 选择复制目标
range.selectNodeContents(dom)
selection.removeAllRanges()
selection.addRange(range) // 已复制文字
console.log('selectedText', selection.toString()) // 执行复制
document.execCommand('copy') // 去除所有选中
selection.removeAllRanges()
// 复制内容成功,通过ctrl+v粘贴使用!
}

参考资料:

select :  https://github.com/zenorocha/select

clipboard.js :  https://github.com/zenorocha/clipboard.js

H5/纯JS实现:把网页中的文字复制到剪切板的更多相关文章

  1. js 最简单的实现复制到剪切板 xl_copy

    使用 npm install xl_copy // 项目中安装 import clipboard form 'xl_copy' // 引用 element.onclick = ()=>{     ...

  2. 复制到剪切板js代码(转)

    <script type="text/javascript" language="javascript"> //复制到剪切板js代码 functio ...

  3. clipboard.js 实现动态获取内容并复制到剪切板

    使用clipboard.js分为以下几个步骤: 1.引入一个clipboard.js的文件: 2.新建一个clipboard对象: 3.点击按钮获取目标对象里面的内容,将其复制到剪切板. 注意:1.目 ...

  4. web复制到剪切板js

    web复制到剪切板 clipboard.js 好使!开源项目,下载地址: https://github.com/zenorocha/clipboard.js 使用方法: 引入 clipboard.mi ...

  5. 在纯HTML的静态网页中添加一段统计网页访问量的JAVA Script代码?

    如何在网站上进行流量统计呢,可以找第三方服务网站去注册,但也可以在网站上直接添加代码,只需将以下代码copy到你的网页中,复制到</body>之前就可以啦!是不是很简单啊! <scr ...

  6. javaScript 实现倒计时 + 获取网页中的文字

    一.倒计时 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <tit ...

  7. clipboard.js 实现web端---> 复制到剪切板功能

    package.json 中: 添加clipboard 依赖 "dependencies": { "vue": "^2.2.2", &quo ...

  8. js 将内容复制到剪切板上

    clipboard是将内容复制到电脑的剪切板上,要引入clipboard.js //将'data-clipboard-text' 样式添加到指定的元素上 $("#effects") ...

  9. js中实现 复制到剪切板 功能

    一:引包 <script type="text/javascript" src="jquery.js"></script> <sc ...

随机推荐

  1. Java入门之人需要注意的5大步骤

    作为最抢手的程序开发言语之一,Java在互联网领域中的方位无需赘言.抢手也带来了高薪和许多的作业时机,对那些预备通过学习Java来改动自己命运的同学来说,需求做好以下作业. 1.考虑一下 学习Java ...

  2. Python程序中的进程操作-进程间通信(multiprocess.Queue)

    目录 一.进程间通信 二.队列 2.1 概念介绍--multiprocess.Queue 2.1.1 方法介绍 2.1.2 其他方法(了解) 三.代码实例--multiprocess.Queue 3. ...

  3. 【Linux命令】EOF自定义终止符

    EOF自定义终止符用法 我们在脚本中经常会发现使用EOF的情况.EOF可以结合cat命令对内容进行追加.比如:执行脚本的时候,需要往一个文件里自动输入多行内容.如果是少数的几行内容,可以用echo命令 ...

  4. pytest框架优化——将异常截屏图片加入到allure报告中

    痛点分析: 在做allure定制化的时候,关于附件添加这一块,我们在代码里可以添加我们准备好的附件,这里用图片,通过下面的方法就能实现 allure.attach(file, '图片描述', allu ...

  5. go语言使用go-sciter创建桌面应用(八) 窗口显示时,自动加载后端数据。

    有些时候我们需要在窗口创建并显示时,加载一些后端的配置,这就需要用到view提供的几个事件. https://sciter.com/docs/content/sciter/View.htm state ...

  6. Rpg maker mv角色扮演游戏制作大师简介

    目录 1:简介 2:基本图片展示 3.和js等平台的合作 @(这里写自定义目录标题) 1:简介   <RPG制作大师MV>为<RPG制作大师>的新版本,于18年11月27日登陆 ...

  7. Git笔记----Git仓库常见经典操作命令

    首次创建仓库上传项目操作在上一篇https://www.cnblogs.com/tk55/p/11795644.html ----好记性不如烂笔头 再次更新到仓库 不是首次更新内容或文件到远程仓库 g ...

  8. ES6变量的解构赋值(二)对象的解构赋值

    前面我们知道,数组的结构赋值需要按顺序进行赋值, let [a,,c] = [,,] console.log(a); console.log(c);//3 let [a,b] = [1];consol ...

  9. JS中new操作符源码实现

    首先我们来看一下实例化一个对象做了浏览器做了什么事情 new的四步操作: 1. 创建一个空对象 2. 设置空对象的__proto__属性继承构造函数的prototype属性,也就是继承构造函数的原型对 ...

  10. 控制台程序(C#)不弹出登录窗口连接到Dynamics CRM Online的Web API

    微软动态CRM专家罗勇 ,回复331或者20190505可方便获取本文,同时可以在第一间得到我发布的最新博文信息,follow me! 我之前的文章 控制台程序(C#)不弹出认证窗口连接到Dynami ...