Consider a static HTML page as test.html, and a printable version of the page has been stored in test.pdf. How can I guide browser to load and print test.pdf instead of test.html when visitors tell their browser to print?
If it's not possible how can I introduce a print button (using JavaScript) within the HTML page to do so?
You cannot force the browser to print a different file than the user is requesting/viewing. That would be a security nightmare!
Option 1 (JS (as requested) & HTML)
I suggest creating a printable version link on your site that will direct the user to the .pdf (opening the PDF in a new window would be preferable).
<!-- JS -->
<script type=text/javascript>
function LoadPrintableVersion() {
window.open(Test.pdf);
}
</script>
<!-- HTML -->
<span id=spanPrintableVersion onclick=LoadPrintableVersion()>
Printable Version
</span>
Option 2 (pure html)
<a href=test.pdf target=_blank>Printable Version</a>
