由于项目需求，希望能够用javascript复制富文本格式的数据，例如全选一个网页Ctrl+C, Ctrl+V到一个word文档中，数据还是原来的格式，显示出来的样子也都和原来一样。现在希望使用javascript实现同样的功能。
由于系统的限制，javascript往系统剪切板上放置的数据只有两种格式Text和URL。具体使用如下：
function CopyToClipBoard(){ var clipBoardContent="abcdefg"; window.clipboardData.setData("Text",clipBoardContent); alert("已复制本页链接,您可以使用Ctrl+V粘贴后,发送给好友!"); }
上述方式只能存放普通的文本，无法保留原来的颜色字体大小等格式。
想要复制指定对象，首先需要定位到目标对象，所幸javascript中可以根据元素的id字段进行定位，可以轻易获取组成它的html文本，但是如果把这些html数据直接放入剪切板中，用Ctrl+V进行粘贴，我们得到的也只是没有解析的html，不能展现有效数据。
在搜索了大量资料之后终于发现了一个好的方法，通过创建ControlRange，然后执行execCommand('Copy')命令将制定元素块放到剪切板中, 此方法仅支持IE浏览器
<script>
function CopyImageToBoard(area){ if (typeof area.contentEditable == 'undefined' || !document.body.createControlRange){ alert('Your IE does not support copy action, please use ctrl + c instead! ”'); }else{ var ctr = document.body.createControlRange(); area.contentEditable = true; ctr.addElement(area); ctr.execCommand('Copy'); area.contentEditable = false; alert('Copy success! '); } }
</script>
<html> <div id ="all"> <a href="javascript:void(0)" onClick="CopyImageToBoard(document.getElementById('all'))" >copy to clipboard</a> <table id="text"> <tr style="background:red"> <td>1</td> <td>2</td> <td>3</td> </tr> <tr style="background:green"> <td>1</td> <td>2</td> <td>3</td> </tr> <tr style="background:black"> <td>1</td> <td>2</td> <td>3</td> </tr> </div> </html>
点击链接按钮之后会复制整个区域到系统剪切板，把数据粘贴到支持富文本格式的编辑器中如word等，就可以看到效果了。