<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

    </head>

    <body>

        <div class="" id='article'>

            这是一段复制文字

        </div>

        <button type="button" name="button" id='button'>复制</button>

    </body>

    <script type="text/javascript">

        document.getElementById('button').onclick=function () {

            if (document.selection) {

                //IE

                var range = document.body.createTextRange();

                range.moveToElementText(document.getElementById('article'));

                range.select();

            } else if (window.getSelection) {

                var range = document.createRange();

                range.selectNode(document.getElementById('article'));

                const selection = window.getSelection();

                if(selection.rangeCount > 0) selection.removeAllRanges();

                window.getSelection().addRange(range);

            }

            document.execCommand('copy');

        }

    </script>

</html>
execCommand在ios低版本不兼容。

execCommand的复制的更多相关文章

  1. JavaScript复制文本探究

    JS复制文本基本分为两步-First: 选中需要复制的节点,及选区:Second: 执行document.execCommand('copy')命令复制 对于选区,属于HTMLInputElement ...

  2. js实现复制内容到粘贴板

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  3. js实现选择及复制粘贴

    最近项目有个点击复制到粘贴板的需求,在这里做一个简单的例子分享给大家,没考虑兼容性,需要兼容的大家去查找下文档 //html<p id="element">测试测试&l ...

  4. 原生js实现复制文本到粘贴板

    项目中经常会遇到点击按钮复制订单号.订单id等内容到粘贴板中的需求.可是通常我们都是用Ctrl + c或右击复制的,别操心,js也是有复制命令的,那就是document.execCommand('co ...

  5. js实现复制粘贴

    项目中经常会遇到点击按钮复制订单号.订单id等内容到粘贴板中的需求.可是通常我们都是用Ctrl + c或右击复制的,别操心,js也是有复制命令的,那就是document.execCommand('co ...

  6. 前端 JavaScript 复制粘贴的奥义——Clipboard 对象概述

    前言 作为一名资深搬砖工,你要问我用得最熟练的技能是什么,那我敢肯定且自豪的告诉你:是 Ctrl+C !是 Ctrl+V! 不信?你来看看我键盘上的 Ctrl.C 和 V 键,那油光发亮的包浆程度,不 ...

  7. JS导出excel 兼容ie、chrome、firefox

    运用js实现将页面中的table导出为excel文件,页面显示如下: 导出的excel文件显示如下: 实现代码: <!DOCTYPE html> <html> <head ...

  8. HTML Table导出为Excel的方法

    HTML Table导出为Excel的方法: 直接上源码 <html> <head> <meta http-equiv="Content-Type" ...

  9. js导入导出excel

    导入: <html xmlns="http://www.w3.org/1999/xhtml" > <head>      <title>Unti ...

随机推荐

  1. linux云计算（keystone swift cinder配置）

    独立安装openstack组件 准备服务器,为安装openstack的服务器加3块额外硬盘 qemu-img create -f qcow2 rh71.img 20G qemu-img create ...

  2. 【Unity3D】Unity3D开发《我的世界》之三、创建一个Chunk

    转载请注明出处:http://www.cnblogs.com/shamoyuu/p/unity_minecraft_03.html 一.引入int类型的Vector3 我们都知道Unity3D里Vec ...

  3. 4.1 PCIe总线的基础知识

    与PCI总线不同,PCIe总线使用端到端的连接方式,在一条PCIe链路的两端只能各连接一个设备,这两个设备互为是数据发送端和数据接收端.PCIe总线除了总线链路外,还具有多个层次,发送端发送数据时将通 ...

  4. JUnit4测试出错（一）

    log4j:WARN No appenders could be found for logger (org.springframework.test.context.junit4.SpringJUn ...

  5. Android5.1系统WebView内存泄漏场景

    问题现象 (该文章,引自零号路的私人博客,本人在浏览框架的开发过程中,用该方式,规避了内存泄露的问题.) 在Android5.1系统中,会发现App存在 WebView 泄漏情况,还比较严重.并且只是 ...

  6. 嵌入式 RTP通话：视频流（H.264）的传输

    从摄像头获取的视频数据,经过编码后(当然,也可以不编码,如果你觉得也很ok的话),既可以 是  开始的数据是  00 00 40 00 40 11 C1 8C 94字节) 四.RTP视频传输代码 #d ...

  7. hi3531 SDK已编译文件系统制作jffs2文件系统镜像并解决问题 .

    一, 安装SDK 1.Hi3531 SDK包位置 在"Hi3531_V100R001***/01.software/board"目录下,您可以看到一个 Hi3531_SDK_Vx. ...

  8. 申请Jetbrain教育帐号，免费使用一年

    JetBrains是一家捷克的软件开发公司.旗下IDE产品有(不限于):(1) IntelliJ,IDEA  Java集成开发工具:(2) PHPStorm,PHP 集成开发工具:(3) PyChar ...

  9. mini设计模式

    创建型 单例模式 饿汉式 public class Singleton () { private static Singleton instance = new Singleton(); privat ...

  10. JavaScript设计模式(4)-桥接模式

    桥接模式 在设计一个 Js API 时,可用来弱化它与使用它的类和对象之间的耦合 1. 事件监听器的回调函数 function getBeerById(id, callback) { asyncReq ...