DataTransferItem: getAsString() method
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.getAsString()
method invokes the given callback with the drag data item's string data as the argument if the item's kind
is a Plain unicode string (i.e. kind
is string
).
Syntax
js
getAsString(callbackFn)
Parameters
callbackFn
-
A callback function that receives following arguments:
data
-
The
DataTransferItem
's string data.
Return value
None (undefined
).
Examples
This example shows the use of the getAsString()
method as an inline function in a drop
event handler.
js
function dropHandler(ev) {
console.log("Drop");
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")) {
// This item is the target node
data[i].getAsString((s) => {
ev.target.appendChild(document.getElementById(s));
});
} else if (data[i].kind === "string" && data[i].type.match("^text/html")) {
// Drag data item is HTML
console.log("… Drop: HTML");
} else if (
data[i].kind === "string" &&
data[i].type.match("^text/uri-list")
) {
// Drag data item is URI
console.log("… Drop: URI");
} else if (data[i].kind === "file" && data[i].type.match("^image/")) {
// Drag data item is an image file
const f = data[i].getAsFile();
console.log("… Drop: File");
}
}
}
Specifications
Specification |
---|
HTML Standard # dom-datatransferitem-getasstring-dev |
Browser compatibility
BCD tables only load in the browser