DataTransferItem
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.
The DataTransferItem
object represents one drag data item. During a drag operation, each DragEvent
has a dataTransfer
property which contains a list
of drag data items. Each item in the list is a DataTransferItem
object.
DataTransferItem
was primarily designed for the HTML Drag and Drop API, and is still specified in the HTML drag-and-drop section, but it is now also used by other APIs, such as ClipboardEvent.clipboardData
and InputEvent.dataTransfer
. Documentation of DataTransferItem
will primarily discuss its usage in drag-and-drop operations, and you should refer to the other APIs' documentation for usage of DataTransferItem
in those contexts.
This interface has no constructor.
Instance properties
DataTransferItem.kind
Read only-
The kind of drag data item,
string
orfile
. DataTransferItem.type
Read only-
The drag data item's type, typically a MIME type.
Instance methods
DataTransferItem.getAsFile()
-
Returns the
File
object associated with the drag data item (or null if the drag item is not a file). DataTransferItem.getAsFileSystemHandle()
Experimental-
Returns a
FileSystemFileHandle
if the dragged item is a file, or aFileSystemDirectoryHandle
if the dragged item is a directory. DataTransferItem.getAsString()
-
Invokes the specified callback with the drag data item string as its argument.
DataTransferItem.webkitGetAsEntry()
-
Returns an object based on
FileSystemEntry
representing the selected file's entry in its file system. This will generally be either aFileSystemFileEntry
orFileSystemDirectoryEntry
object.
Example
All of this interface's methods and properties have their own reference page, and each reference page has an example of its usage.
Specifications
Specification |
---|
HTML Standard # the-datatransferitem-interface |
Browser compatibility
BCD tables only load in the browser