HTML5 Web Application Development By Example Beginner's guide

The File API

We may not be able to save files directly to the user's filesystem, but we can access files using HTML5's File API. The File API allows you to get information about, and load the contents of, files that the user selects. The user can select files using an input element with a type of file. The process for loading a file works in the following way:

1. The user selects one or more files using a <input type="file"> element.
2. We get the list of files from the input element's files property. The list is a FileList object containing File objects.
3. You can enumerate over the file list and access the files just like you would an array.

   The File object contains three fields.

   • name: This is the filename. It doesn't include path information.
   • size: This ...