<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Print to PDF</title>
</head>
<body>
<div id="content">
<h1>Hello, World!</h1>
<p>This is a sample content to be printed to PDF.</p>
</div>
<button id="print">Print to PDF</button>
<script>
document.getElementById('print').addEventListener('click', function () {
var content = document.getElementById('content').innerHTML;
var style = '<style>body { font-family: Arial, sans-serif; }</style>';
var html = '<html><head>' + style + '</head><body>' + content + '</body></html>';
var blob = new Blob([html], { type: 'application/pdf' });
var url = URL.createObjectURL(blob);
var iframe = document.createElement('iframe');
iframe.style.display = 'none';
document.body.appendChild(iframe);
iframe.src = url;
iframe.onload = function () {
iframe.contentWindow.print();
document.body.removeChild(iframe);
URL.revokeObjectURL(url);
};
});
</script>
</body>
</html>