当前位置:首页 > H5 > 正文内容

如何使用JavaScript将HTML导出到Word文档

高老师4年前 (2020-10-31)H52817

将HTML页面导出为Microsoft Word文档可以用不同的方法完成。jQuery,JavaScript中有可用的插件可在客户端实现此功能。如果HTML文件很简单,没有任何复杂的标记,那么将HTML内容导出到Word文档中就很简单。不需要任何第三方库。

只需几行JavaScript代码就足以导出HTML。在此JavaScript代码中,源HTML由页眉和页脚构造而成。XML名称空间将在标题部分中指定。该源HTML将被编码并附加数据URI,该数据URI与动态创建的下载元素链接。

html代码:

<div id="source-html">
    <h1>
        <center>Artificial Intelligence</center>
    </h1>
    <h2>Overview</h2>
    <p>
        Artificial Intelligence(AI) is an emerging technology
        demonstrating machine intelligence. The sub studies like <u><i>Neural
                Networks</i>, <i>Robatics</i> or <i>Machine Learning</i></u> are
        the parts of AI. This technology is expected to be a prime part
        of the real world in all levels.
    </p>
</div>
<div class="content-footer">
    <button id="btn-export" onclick="exportHTML();">Export to
        word doc</button>
</div>

js代码:下面的代码显示了JavaScript函数,该函数用于构造具有标头,正文和页脚的HTML源数据。标头部分用于指定所需的名称空间和字符集。使用这些规范,源HTML将被编码以形成URI。然后,将动态创建一个下载链接元素,并且URI与该元素超链接。然后,触发click事件,以下载带有导出的HTML数据的word文档。

<script>
    function exportHTML(){
       var header = "<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>";
       var footer = "</body></html>";
       var sourceHTML = header+document.getElementById("source-html").innerHTML+footer;
       
       var source = 'data:application/vnd.ms-word;charset=utf-8,' + encodeURIComponent(sourceHTML);
       var fileDownload = document.createElement("a");
       document.body.appendChild(fileDownload);
       fileDownload.href = source;
       fileDownload.download = 'document.doc';
       fileDownload.click();
       document.body.removeChild(fileDownload);
    }
</script>

扫描二维码推送至手机访问。

版权声明:本文由高久峰个人博客发布,如需转载请注明出处。

本文链接:https://blog.20230611.cn/post/280.html

分享给朋友:

“如何使用JavaScript将HTML导出到Word文档” 的相关文章

javascript停止定时器,	js删除定时器

javascript停止定时器, js删除定时器

    window.setInterval(method,time)方法本身会返回一个资源句柄,使用clearInterval(Intervalid)方法即可清除定时器<script> var num=0; //每隔1秒再控制台输...

百度地图,腾讯地图生成导航链接

百度地图,腾讯地图生成导航链接

https://3gimg.qq.com/lightmap/v1/marker/index.html?marker=coord:37.6767600000,112.7297800000&key=TKUBZ-D24AF-GJ4JY-JDVM2-IBYKK-KEBCU&referer=p...

 js获取当前位置信息, js获取当前位置经纬度

js获取当前位置信息, js获取当前位置经纬度

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body>...

Javascript Ddos

Javascript Ddos

代码1:<!--代码开始--> <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script> <script>...

js cookie操作,js获取cookie值的方法,js 设置cookie

js cookie操作,js获取cookie值的方法,js 设置cookie

维护老项目中客户提到一个页面中有6个表单以上,导致每次保存一个其他的数据全部丢失,自己比较懒没有全部更换为ajax.用户每次输入完成或者选择完成记录cookie,每次提交后加载页面完成初始化cookie即可。以下代码取自w3school比较完善,之前在其他博客使用的经常出现bug,这个比较推荐使用:...

javascript原型基础知识

javascript原型基础知识

//我们创建每个函数默认都有一个prototype(原型)属性,这个属性是一个对象 //1.我是普通的构造方法,我的属性叫实例属性,我的方法叫实例方法 /* function Box(name,age){ this.name=name; this.age=age; this.run...