DataTransferItem：type 属性
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
只读属性 DataTransferItem.type 返回代表拖动数据项的 DataTransferItem 对象的类型（格式）。type 是一个 Unicode 字符串，通常由 MIME 类型给出（虽然 MIME 类型不是必须的）。
一些示例类型：text/plain 和 text/html。
值
一个表示拖动数据项类型的字符串。
示例
该示例演示了 type 属性的用法。
js
function dropHandler(ev) {
console.log("放置");
ev.preventDefault();
const data = ev.dataTransfer.items;
for (let i = 0; i < data.length; i += 1) {
if (data[i].kind === "string" && data[i].type.match("^text/plain")) {
// 该项目是目标节点
data[i].getAsString((s) => {
ev.target.appendChild(document.getElementById(s));
});
} else if (data[i].kind === "string" && data[i].type.match("^text/html")) {
// 拖动数据项是 HTML
console.log("放置：HTML");
} else if (
data[i].kind === "string" &&
data[i].type.match("^text/uri-list")
) {
// 拖动数据项是 URI
console.log("放置：URI");
} else if (data[i].kind === "file" && data[i].type.match("^image/")) {
// 拖动数据项是图像文件
const f = data[i].getAsFile();
console.log("……放置：文件");
}
}
}
规范
| Specification |
|---|
| HTML # dom-datatransferitem-type-dev |