JavaScript to directly manipulate the implementation of local files code _javascript tips

Mozilla recently submitted a draft to the consortium aimed at launching a JavaScript API that allows JavaScript scripts to manipulate local files directly, and the API has been heavily supported in Firefox's latest browser version, but for security reasons, The API will only provide limited access to local files.
The API introduces a FileReader object that can asynchronously load files in the local file system and allows developers to assign callback functions for events such as load failure, progress, load completion, and provides methods that can read text or binary data from local files and pass a abort Method interrupts the operation at any time.

The FileReader object makes file access to the client a reality, and users do not have to upload files to the server as before, and in fact, IE and Firefox already have some non-standard ways to access local files, but these methods are not standard JavaScript behavior.

FileReader objects do not require special permissions, but for obvious security reasons, direct access to file paths is not allowed, and must be combined with a regular HTML file object, after the user clicks Browse, selects local files, and JavaScript passes through the DOM Referencing and manipulating the file, this mechanism makes the API relatively secure because any local file acquisition requires the user's human involvement.

The following example uses the API to open a local file and display the contents of the file in a div container, and we can even add the contenteditable attribute to the Div, where the user can edit the contents of the file directly, but the API does not provide a way to write the contents of the file back to the local file. So the content you edited cannot be saved.

Although adding APIs to JavaScript is not a major technological revolution, it will broaden the horizons of Web applications and enable more and more web platforms to function.