Edit, save, self-modifying HTML document; format generated HTML, JavaScript

by

Your replace function replaces until the /textarea> that is in your clone variable. It doesn’t do it from the first file because there’s a newline character after textarea in the html. One way to fix it would be to add a newline character in the generated html. Like this:

var clone = ["<!doctype html><head></head><body><textarea>"
          + input.value
         // add newline here
          + "</textarea>\n"
          + "<button>save file</button>"
          + "<script type="text/javascript">"
          + "var saveFile = document.getElementsByTagName('button')[0];"
          + "var input = document.getElementsByTagName('textarea')[0];"
          + "var a = document.createElement('a');"
          + "saveFile.onclick = function(e) {"
          + "var clone="<!doctype html>"+ document.documentElement.outerHTML.replace(/<textarea>.*<.+textarea>/, '<textarea>'+document.getElementsByTagName('textarea')[0].value+'<\/textarea>');"
          + "console.log(clone);"
          + "var file = new Blob([clone], {'type':'text/html'});"
          + "a.href = URL.createObjectURL(file);"
          + "a.download = 'file-' + new Date().getTime() + '.html';"
          + "a.click();"
          + "};"
          + "</scr"+"ipt>"
          + "</body>"
          + "</html>"];

More Related Contents:

  1. How do I put a link inside javascript
  2. prevent refresh of page when button inside form clicked
  3. Make iframe automatically adjust height according to the contents without using scrollbar? [duplicate]
  4. load scripts asynchronously
  5. Get a pixel from HTML Canvas?
  6. Trigger event when user scroll to specific element – with jQuery
  7. (change) vs (ngModelChange) in angular
  8. Using HTML5 file uploads with AJAX and jQuery
  9. How to submit an HTML form without redirection
  10. Is there a DOM event that fires when an HTML select element is closed?
  11. \u200b (Zero width space) characters in my JS code. Where did they come from?
  12. How do I remove tinyMCE and then re-add it?
  13. How to find the width of a div using vanilla JavaScript?
  14. play .wav sound file encoded in base64 with javascript
  15. Javascript regular expression to validate URL
  16. Animated gif only loops once in Chrome and Firefox
  17. Shrink DIV to text that’s wrapped to its max-width?
  18. Why is the variable holding the input value always logged as empty?
  19. How to ONLY trigger parent click event when a child is clicked
  20. append option to select menu?
  21. How can I detect when a new element has been added to the document in jquery?
  22. How to read line by line of a text area HTML tag
  23. How can I highlight the line of text that is closest to the mouse?
  24. How can I add multiple sources to an HTML5 audio tag, programmatically?
  25. jQuery: trigger a hover event from another element
  26. How do I disable a href link in JavaScript?
  27. Load JSON content from a local file with http.get() in Angular 2
  28. How to use jQuery’s drop event to upload files dragged from the desktop?
  29. Embed google map is wrong displayed until resizing webpage
  30. call the same jQuery function in multiple buttons

Leave a Comment