Loading, Editing, and Saving a Text File in HTML5 Using Javascript

This Could Be Better

The HTML and JavaScript code below makes use of some features of HTML5 (specifically the “Blob” object, the File API, and the “download” attribute of the “a” tag) to allow the user to load, edit, and save a text file on their local computer.  As of this writing, it works in both Chrome and Firefox browsers, though sadly it requires a little bit of custom code for each.

To see it in action, copy it into an .html file and open that file in a web browser that runs JavaScript.  Or, for an online version, visit http://thiscouldbebetter.neocities.org/texteditor.html.

UPDATE 2016/06/13 – I have updated this code to reflect the fact that the window.URL object is no longer experimental, and thus is not invoked using different names in different browsers. The code is a little cleaner as a result.

View original post