document.execCommand('copy') 在不在 DOM 中的对象上？

Question

我不是100%确定如何描述这个，所以我将简单地粘贴三段相关代码。

我能做到：

var dl = $('<a>',{
    style: 'display: none',
    download: this.name + '.txt',
    href: window.URL.createObjectURL(data, {type: "octet/stream"}))
});
dl[0].click();

我能做到：

copydeck = $("<textarea>").val(this.list.join("\r\n"));
$('body').append(copydeck);
copydeck.select();
document.execCommand('copy');
copydeck.remove();

但是我不能这样做:

copydeck = $("<textarea>").val(this.list.join("\r\n"));
copydeck[0].select();
document.execCommand('copy');

为什么？我在这里错过了什么？我是否无法 select 或复制不在 DOM 中的元素？有没有办法在不将对象附加到正文的情况下执行此操作？

Answer 1

Why? What am I missing here?

textarea 不在 document 中，因此调用 document.execCommand('copy') 不会对其进行操作。请记住，可以有多个文档（与各种 windows 相关，例如 iframe），并且直到或除非某个元素在文档中，否则它...不在文档中。

您可以附加 textarea，发出命令，然后将其删除，而不会导致显示中发生任何事情。也就是说，对于我在 Linux 上使用 Chrome，您的代码最终不会将任何内容复制到剪贴板（无论我是从 DOM 中的 textarea 还是稍后动态添加），即使我将它放在 click 处理程序中（例如，直接响应用户事件）。

document.execCommand('copy') 在不在 DOM 中的对象上？

document.execCommand('copy') on objects not in DOM?

javascript

clipboard

jquery

dom

google-chrome-extension