原生js实现剪切板的使用

有时候需要操作剪切板，比如“复制”一段文本

思路如下：

1. 构造一个textarea元素（该元素只是临时使用，看不见但是存在）
2. 给元素的内容赋值为你所想要copy的文本
3. 挂载元素
4. 全选元素中的文本
5. 聚焦元素（focus）
6. 调用execCommand方法
7. 把元素remove掉

代码如下：

var content='被复制文本，test';


/*构造一个textarea*/
let fakeElem = document.createElement('textarea');

/*该textarea必须存在，即display不能为none，但是又要看不见*/
fakeElem.style.fontSize = '12pt';                 //防止元素能在ios上缩放
fakeElem.style.border = '0';                      //修改元素的样式
fakeElem.style.padding = '0';
fakeElem.style.margin = '0';
fakeElem.style.position = 'absolute';             //将元素水平移出屏幕可视区域
fakeElem.style.left = '-9999px';
var yPosition = window.pageYOffset || document.documentElement.scrollTop;        
fakeElem.style.top = yPosition + 'px';            //在垂直方向移动相同距离
fakeElem.setAttribute('readonly', '');            //设置为不可读

fakeElem.value = content;                         //赋值

document.body.appendChild(fakeElem);              //挂载元素

/*选中元素中的文本，下面为兼容写法*/
if(fakeElem.createTextRange){//IE浏览器
    var range = fakeElem.createTextRange();         
    range.moveStart("character", 0);
    range.moveEnd("character",content.length);
    range.select();
}else{
    fakeElem.setSelectionRange(0, content.length);
    fakeElem.focus();
}

/*调用execCommand，复制选中区域文本*/
document.execCommand('copy');

/*remove元素*/
document.body.removeChild(fakeElem);

p.s. 当然，上面这段代码应该封装成一个方法，传不同的content进去