Save HTML locally with Javascript

Question

I know that client-side Javascript cannot write data to the local filesystem, for obvious security reasons.

The only way to save data locally with Javascript seems to be with cookies, localStorage, or allow the user to download a file (with a "Save..." dialog box or to the browser's default Download folder).

But is it possible, in the very specific case when the file is accessed locally with an URL like file:///D:/test/index.html (and not through internet) to write data locally ? (without any server language, and even without any server at all: just local browsing of a HTML file)

For example, would it be possible, by clicking on SAVE here:

  <div contenteditable="true" style="height:200px;">Content editable - edit me and save!</div>   <button>Save</button>

...that such a HTML file (accessed through file:///D:/test/index.html) is overwritten with its new content ? (i.e. the local HTML file should be updated when SAVE is pressed).

---

---

TL;DR: Is this possible to SAVE a file thanks to Javascript, when the HTML page is accessed locally?

Note: I want to be able to silently save, not propose a Download/Save dialog box in which the user has to choose where to download, then "Are you sure to want to overwrite" etc.

---

EDIT : Why this question? I'm doing an in-browser notepad that I can run locally without any server (no Apache, no PHP). I need to be able to save easily without having to deal with Dialog Box "Where do you want to download the file?" and having to always re-browse to the same folder to overwrite the currently-being-edited file. I would like a simple UX like in any notepad program: CTRL+S done, the current file is saved! (example: MS Word doesn't ask to browse where you want to save the file each time you do "Save": CTRL+S, done!)

Answer 1

You can just use the Blob function:

function save() {   var htmlContent = ["your-content-here"];   var bl = new Blob(htmlContent, {type: "text/html"});   var a = document.createElement("a");   a.href = URL.createObjectURL(bl);   a.download = "your-download-name-here.html";   a.hidden = true;   document.body.appendChild(a);   a.innerHTML = "something random - nobody will see this, it doesn't matter what you put here";   a.click(); } 

and your file will save.