The drawback is that the exported Word document does not have a style in HTML and is appropriate for exporting the HTML of the article class
1, the introduction of documents (below the plugin source code)
<script type= "Text/javascript" src= ". /libs/jquery/1.11.1/jquery-1.11.1.min.js "></script> //jquery Version No restrictions
<script type= "Text/javascript" src= ". /libs/jquery/filesaver.js "></script><script type=" Text/javascript "src=". /libs/jquery/jquery.wordexport.js "></script>
2. Click events, use Plugins, export word
$ (function () {$ ("button"). Click (function () { $ ("#content"). Wordexport ("FileName"); FileName is the name of the exported Word file, content is the HTML content container Html2canvas (document.getElementById ("content") to be exported, { Onrendered:function (canvas) { //renders HTML into canvas by Html2canvas, then obtains the picture data var imgdata = Canvas.todataurl (' image /jpeg '); Initialize the PDF, set the corresponding format var doc = new Jspdf ("P", "MM", "A4"); Doc.setfillcolor (0,0,0); Here is the A4 paper size doc.addimage (imgdata, ' JPEG ', 0, 0,210,297); The output holds a PDF doc.save (' content.pdf ') named content; } });})
3. Note: If the HTML content to be exported is in an IFRAME and contains a picture, you need to set the cross-domain attribute in the HTML img tag: crossorigin= "Anonymous" otherwise the corresponding picture in the exported word will not appear
4. Plugin Source code
Filesaver.js
/* Filesaver.js * A saveAs () filesaver implementation. * 1.3.2 * 2016-06-16 18:25:19 * * by Eli Grey, http://eligrey.com * license:mit * See Https://github.com/eligrey/FileSa Ver.js/blob/master/license.md *//*global self *//*jslint bitwise:true, indent:4, Laxbreak:true, Laxcomma:true, Smartta Bs:true, Plusplus:true *//*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js */var saveas = SaveAs | | (function (view) {"Use strict";//IE <10 is explicitly unsupportedif (typeof view = = = "undefined" | | typeof Navigator! = = "undefined" &&/msie [1-9]\./.test (navigator.useragent)) {return;} var doc = view.document//Only get URLs when necessary in case blob.js hasn ' t overridden it yet, Get_url = function () {R Eturn view. URL | | View.webkiturl | | View;}, Save_link = Doc.createelementns ("http://www.w3.org/1999/xhtml", "a"), Can_use_save_link = "Download" in Save_ Link, click = function (node) {var event = new MouseEvent ("click"); Node.dispatchevent (event);},Is_safari =/constructor/i.test (view. HtmlElement), Is_chrome_ios =/crios\/[\d]+/.test (navigator.useragent), throw_outside = function (ex) {( View.setimmediate | | View.settimeout) (function () {throw ex;}, 0);}, Force_saveable_type = "Application/octet-stream"//The Blob API is Fundame Ntally broken as there is no "downloadfinished" event to subscribe to, Arbitrary_revoke_timeout = $ * +/in MS, Revo ke = function (file) {var revoker = function () {if (typeof file = = = "string") {//file is an object Urlget_url (). revokeobj Ecturl (file);} else {//file is a filefile.remove ();}}; SetTimeout (Revoker, arbitrary_revoke_timeout);}, dispatch = function (Filesaver, event_types, event) {event_types = []. Concat (event_types); var i = Event_types.length;while (i--) {var listener = filesaver["on" + event_types[i]];if (typeof Lis Tener = = = "function") {try {listener.call (filesaver, Event | | filesaver);} catch (ex) {throw_outside (ex);}}}, Auto_bom = Function (BLOB) {//prepend BOM for UTF-8 XML and text/* tYpes (including HTML)//Note:your browser would automatically convert UTF-16 U+feff to EF BB bfif (/^\s* (?: Text\/\s*|appli Cation\/xml|\s*\/\s*\+xml) \s*;. *charset\s*=\s*utf-8/i.test (Blob.type)) {return new blob ([String.fromCharCode (0xFEFF), blob], {type:blob.type});} return blob;}, Filesaver = function (blob, name, No_auto_bom) {if (!no_auto_bom) {blob = Auto_bom (BLOB);} First try A.download, then Web filesystem, then object Urlsvar filesaver = this, type = blob.type, force = Type = = = Fo Rce_saveable_type, object_url, Dispatch_all = function () {Dispatch (Filesaver, "Writestart Progress write Writeend". Split ("")); On any filesys errors revert to saving with object URLs, Fs_error = function () {if (Is_chrome_ios | | (Force && Is_safari)) && view. FileReader) {//Safari doesn ' t allow downloading of blob urlsvar reader = new FileReader (); reader.onloadend = function () { var url = is_chrome_ios? Reader.result:reader.result.replace (/^data:[^;] *;/, ' data:attachment/file; '); VAr popup = view.open (URL, ' _blank '); if (!popup) view.location.href = url;url=undefined; Release reference before dispatchingfilesaver.readystate = Filesaver. Done;dispatch_all ();}; Reader.readasdataurl (BLOB); filesaver.readystate = Filesaver. Init;return;} Don ' t create more object URLs than Neededif (!object_url) {object_url = Get_url (). Createobjecturl (BLOB);} if (force) {view.location.href = Object_url;} else {var opened = View.open (Object_url, ' _blank '); if (!opened) {//Apple do Es not allow window.open, see https://developer.apple.com/library/safari/documentation/Tools/Conceptual/ Safariextensionguide/workingwithwindowsandtabs/workingwithwindowsandtabs.htmlview.location.href = Object_url;}} Filesaver.readystate = Filesaver. Done;dispatch_all (); revoke (object_url);}; Filesaver.readystate = Filesaver. Init;if (can_use_save_link) {object_url = Get_url (). Createobjecturl (BLOB); SetTimeout (function () {save_link.href = Object_url;save_link.download = Name;click (save_link);d ispatch_all (); Revoke (objeCt_url); filesaver.readystate = Filesaver. Done;}); return;} Fs_error ();}, Fs_proto = filesaver.prototype, saveAs = function (blob, name, No_auto_bom) {return new Filesaver (BLOB, name || Blob.name | | "Download", No_auto_bom);};/ /IE (native SaveAs) if (typeof navigator!== "undefined" && navigator.mssaveoropenblob) {return function (BLOB, Name, No_auto_bom) {name = name | | blob.name | | "Download"; if (!no_auto_bom) {blob = Auto_bom (BLOB);} Return Navigator.mssaveoropenblob (blob, name);};} Fs_proto.abort = function () {}; Fs_proto.readystate = Fs_proto. INIT = 0; Fs_proto. WRITING = 1; Fs_proto. Done = 2; Fs_proto.error =fs_proto.onwritestart =fs_proto.onprogress =fs_proto.onwrite =fs_proto.onabort =FS_proto.onerror =FS _proto.onwriteend =null;return SaveAs;} (typeof self!== "undefined" && self| | typeof window!== "undefined" && window| | this.content)); /' self ' was undefined in Firefox for Android content script context//and ' This ' was nsicontentframemessagemanager//with An attribute ' content ' corresponds to the windowif (typeof module!== "undefined" && module.exports) {module . Exports.saveas = SaveAs;} else if ((typeof define!== "undefined" && define!== null) && (DEFINE.AMD!== null)) {define ([], functi On () {return saveAs; });}
Jquery.wordexport.js
if (typeof jQuery!== "undefined" && typeof saveAs!== "undefined") {(function ($) {$.fn.wordexport = f Unction (filename) {filename = typeof filename!== ' undefined '? FileName: "Jquery-word-export"; var static = {mhtml: {top: "mime-version:1.0\ncontent-base:" + location.href + "\nco ntent-type:multipart/related; Boundary=\ "NEXT. Item-boundary\ "; type=\" text/html\ "\n\n--next.item-boundary\ncontent-type:text/html; Charset=\ "utf-8\" \ncontent-location: "+ location.href +" \n\n<! DOCTYPE html>\n
JS Export HTML to Word