JS如何实现拷贝网页部分内容进剪贴板（含文字、base64图片）

Question

https://mbd.baidu.com/newspag...
在网址中执行以下JS代码，图片会自动被裁剪，原图片会被替换成base64资源，怎么实现将文章的文字和图片送进剪贴板？

for (var i = 0; i < document.getElementsByClassName('contentImg linexRBS').length; i++) {
  var contImg = document.getElementsByClassName('contentImg linexRBS')[i]

  // 1.onload必须指定为function  这里立即执行函数的返回不是一个function，要做修改
  var targetImg = new Image();
  targetImg.crossOrigin = '';
  targetImg.src = contImg.getElementsByTagName("img")[0].src;
  targetImg.onload = (function (num,contImg,targetImg) {
    //2. 使用闭包后 注意变量生成的时机，注意对比下哪些变量需要放到闭包里
    return function (){
      var tupianwidth = contImg.offsetWidth;
      var tupianheight = contImg.offsetHeight;
      tupianheight = tupianheight - 200;

      var canvas = document.createElement('canvas');
      canvas.width = tupianwidth;
      canvas.height = tupianheight;

      var cxt = canvas.getContext('2d');
      cxt.drawImage(targetImg, 0, 0);
      var clipImage = canvas.toDataURL("image/png", 1);
      document.getElementsByClassName('contentImg linexRBS')[num].getElementsByTagName("img")[0].src = clipImage;
    }
  })(i,contImg,targetImg);
}

Answer 1

  /**
   * 复制dom的内容
   * @param {String} id dom的ID
   */
  copyData (value) {
    let inputDom = document.createElement('input')
    inputDom.value = value
    document.body.appendChild(inputDom)
    inputDom.select() // 选择对象
    document.execCommand('Copy') // 执行浏览器复制命令
    document.body.removeChild(inputDom) // 删除DOM
    Message({
      type: 'success',
      message: '复制成功'
    })
  },

Answer 2

https://www.zhangxinxu.com/wo...

Answer 3

可以参考css属性user-modify

user-modify: read-only;
user-modify: read-write; //可以输入富文本,也就是粘贴过来的文本会保留原样式
user-modify: write-only;
user-modify: read-write-plaintext-only

注意加上浏览器前缀。