剪贴板项目：ClipboardItem() 构造函数
ClipboardItem() 构造函数创建一个新的ClipboardItem 对象，它表示要通过剪贴板 API clipboard.write() 和clipboard.read() 方法（分别）存储或检索的数据。
注意：图像格式支持因浏览器而异。有关Clipboard 接口，请参阅浏览器兼容性表。
语法
js
new ClipboardItem(data)
new ClipboardItem(data, options)
参数
data-
一个
Object，其中MIME 类型 作为键，数据作为值。数据可以表示为Blob、String或Promise，它解析为 blob 或字符串。 options可选-
具有以下属性的对象
presentationStyle可选-
三个字符串之一：
unspecified、inline或attachment。默认值为unspecified。
注意：您还可以通过Clipboard.readText() 和Clipboard.writeText() 方法与文本进行交互，这些方法属于Clipboard 接口。
示例
以下示例使用fetch() 请求 PNG 图像，进而使用Response.blob() 方法创建一个新的ClipboardItem。然后，使用Clipboard.write() 方法将此项目写入剪贴板。
注意：您一次只能传入一个剪贴板项目。
js
async function writeClipImg() {
try {
if (ClipboardItem.supports("image/png")) {
const imgURL = "/myimage.png";
const data = await fetch(imgURL);
const blob = await data.blob();
await navigator.clipboard.write([
new ClipboardItem({
[blob.type]: blob,
}),
]);
console.log("Fetched image copied.");
} else {
console.log("image png is not suported");
}
} catch (err) {
console.error(err.name, err.message);
}
}
规范
| 规范 |
|---|
| 剪贴板 API 和事件 # dom-clipboarditem-clipboarditem |
浏览器兼容性
BCD 表仅在启用 JavaScript 的浏览器中加载。