How do I save my HTML document using SaveFile.js?

Question

I'm trying to allow for a save feature on my webpage. I'm using the 'SaveFile.js' module found here: 'https://github.com/eligrey/FileSaver.js/' When a user clicks the save button, the document should download itself as an HTML file with all of its elements like input boxes, pictures etc. However, what gets downloaded isn't the full HTML document. Just some text on an HTML page:

Why is this happening?

<button type="button" name="btnSave" onclick="saveHTMLFile()">Save</button>

<script>
  function saveHTMLFile(){
  let fileToSave=document;
  let blob = new Blob([fileToSave],{type:"text/html;charset=utf-8"});
  saveAs(blob,'SavedOutline.html')
}
  </script>

The `document` object is an object representing the DOM, not a string of HTML. — Quentin, Dec 06 '19 at 14:05

score 1 · Accepted Answer · answered Dec 06 '19 at 14:06

You need to serialize the document as a string. Try using document.documentElement.outerHTML instead of just document.

document.documentElement will give you the root element of the document
el.outerHTML will give you the html of the element as string

In your code:


<button type="button" name="btnSave" onclick="saveHTMLFile()">Save</button>

<script>
  function saveHTMLFile(){
  let fileToSave=document.documentElement.outerHTML;
  let blob = new Blob([fileToSave],{type:"text/html;charset=utf-8"});
  saveAs(blob,'SavedOutline.html')
}
  </script>

score -1 · Answer 2 · answered Dec 06 '19 at 13:56

-1

I am not sure if it will help, but you can try this peace of code.

var file = new File(["Hello, world!"], "hello world.txt", {type: "text/plain;charset=utf-8"});
FileSaver.saveAs(file);

When you are using new Blob() documentation says it is only for Saving text

answered Dec 06 '19 at 13:56

Georgi Vasilev

1
1

1

That doesn't help, because the problem is in getting the HTML as a string. You've throw the HTML away and have a hardcoded string. – Quentin Dec 06 '19 at 14:04

How do I save my HTML document using SaveFile.js?

2 Answers2