<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Download Page Screenshot as Word</title><script src="https://code.jquery.com/jquery-3.6.0.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.3.2/html2canvas.min.js"></script>
</head>
<body><div id="content-to-capture"><!-- This is the content you want to capture --><h1>Hello, World!</h1><p>This is an example paragraph.</p></div><button id="downloadWord">Download Word</button><script>$(document).ready(function() {$('#downloadWord').click(function() {html2canvas(document.getElementById('content-to-capture')).then(function(canvas) {// Convert canvas to data URLconst dataUrl = canvas.toDataURL('image/png');// Create a Blob from the data URLconst byteString = atob(dataUrl.split(',')[1]);const mimeString = dataUrl.split(',')[0].split(':')[1].split(';')[0];const ab = new ArrayBuffer(byteString.length);const ia = new Uint8Array(ab);for (let i = 0; i < byteString.length; i++) {ia[i] = byteString.charCodeAt(i);}const blob = new Blob([ab], {type: mimeString});// Generate a simple .doc file contentconst content = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>Export HTML to Word Document with JavaScript</title></head><body><img src='${dataUrl}' /></body></html>`;// Create a Blob for the .doc fileconst docBlob = new Blob(['\ufeff', content], {type: 'application/msword'});// Save the Blob as a filesaveAs(docBlob, 'document.doc');});});});</script>
</body>
</html>