FileList - Web APIs | MDN (original) (raw)

Instance properties

length Read only

A read-only value indicating the number of files in the list.

Instance methods

item()

Returns a File object representing the file at the specified index in the file list.

Example

Logging filenames

In this example, we log the names of all the files selected by the user.

HTML

<input id="myfiles" multiple type="file" />
<pre class="output">Selected files:</pre>

CSS

.output {
  overflow: scroll;
  margin: 1rem 0;
  height: 200px;
}

JavaScript

const output = document.querySelector(".output");
const fileInput = document.querySelector("#myfiles");

fileInput.addEventListener("change", () => {
  for (const file of fileInput.files) {
    output.innerText += `\n${file.name}`;
  }
});

Result

Specifications

Browser compatibility

See also

• Using files from web applications
• File
• FileReader