How to trigger a file download when clicking an HTML button or JavaScript

You can trigger a download with the HTML5 download attribute.

<a href="path_to_file" download="proposed_file_name">Download</a>

Where:

  • path_to_file is a path that resolves to an URL on the same origin. That means the page and the file must share the same domain, subdomain, protocol (HTTP vs. HTTPS), and port (if specified). Exceptions are blob: and data: (which always work), and file: (which never works).
  • proposed_file_name is the filename to save to. If it is blank, the browser defaults to the file's name.

Documentation: MDN, HTML Standard on downloading, HTML Standard on download, CanIUse


For the button you can do

<form method="get" action="file.doc">
   <button type="submit">Download!</button>
</form>

HTML:

<button type="submit" onclick="window.open('file.doc')">Download!</button>