DataTransferItem: getAsFile() メソッド

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2016年11月⁩.

アイテムがファイルの場合、 DataTransferItem.getAsFile() メソッドはドラッグデータ項目の File オブジェクトを返します。項目がファイルでない場合、このメソッドは null を返します。

構文

getAsFile()

引数

なし。

返値

ドラッグデータ項目がファイルである場合、 File オブジェクトが返されます。それ以外の場合は null が返されます。

例

この例が、 getAsFile() メソッドを drop イベントハンドラー内で使用するものです。

function dropHandler(ev) { console.log("Drop"); ev.preventDefault(); for (const item of ev.dataTransfer.items) { if (item.kind === "string" && item.type.match("^text/plain")) { // This item is the target node item.getAsString((s) => { ev.target.appendChild(document.getElementById(s)); }); } else if (item.kind === "string" && item.type.match("^text/html")) { // Drag data item is HTML console.log("… Drop: HTML"); } else if (item.kind === "string" && item.type.match("^text/uri-list")) { // Drag data item is URI console.log("… Drop: URI"); } else if (item.kind === "file" && item.type.match("^image/")) { // Drag data item is an image file const f = item.getAsFile(); console.log("… Drop: File"); } } }