I want to download a file which is created from DOM element. So a user clicks a button on web page and it invokes a javascript method which may grab the contents of DOM element and prompt user for download.
I am able to grab contents of the DOM element inside a Javascript Var. But not sure how to proceed further.
For grabbing the DOM element i am using:
var elem = document.getElementById("userDownload"); I am not sure if I understand correctly what is the content that you are trying to download. If you have the content (which sounds like the HTML of an element?) stored in a variable, you can try:
("#downloadbutton").click(function() { //var content = content of file; var dl = document.createElement('a'); dl.setAttribute('href', 'data:text/csv;charset=utf-8,' + encodeURIComponent(content)); dl.setAttribute('download', 'filename.txt'); dl.click(); }); 
I appreciated finding this question, but at least on Firefox running with linux, you need to append the dl element to the document to get the click functionality to work. I haven't tested extensively on other browsers how necessary this is, but it is necessary on some at least, so I recommend the following modification:
var content = document.getElementById("elem").innerHTML; var dl = document.createElement('a'); dl.setAttribute('href', 'data:text/csv;charset=utf-8,' + encodeURIComponent(content)); dl.setAttribute('download', 'filename.txt'); // Set hidden so the element doesn't disrupt your page dl.setAttribute('visibility', 'hidden'); dl.setAttribute('display', 'none'); // Append to page document.body.appendChild(dl); // Now you can trigger the click dl.click(); Figured it out: I had to do `
function myAlert(){ var content = document.getElementById("elem").innerHTML; var dl = document.createElement('a'); dl.setAttribute('href', 'data:text/csv;charset=utf-8,' + encodeURIComponent(content)); dl.setAttribute('download', 'filename.txt'); dl.click(); } document.addEventListener('DOMContentLoaded', function () { document.getElementById('alertButton').addEventListener('click', myAlert); });