将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> 由于工作需要长期使用Ajax,一个页面重复的AJAX请求太多,于是封装起来,只需要编写回调函数/* ------------- 使用方法: 1.ajaxrequest()函数执行准备的参数(1.请求地址2.发送数据字符串拼接3.type值可选get/post4.回调函数名称) exam...
WebSql的原理是浏览器集成了sqllite数据库,Js操作,浏览器协助完成,没有多复杂。<!-- 三个核心方法  ...
<form action="save.php" method="post" target="nm_iframe"> &nbs...
<!-- 三个核心方法 openDatabase:这个方法使用现有数据库或创建...
<!DOCTYPE html> <html> <head> <title>捕捉和冒泡</title> <meta charset="utf-8"> </head> <bo...
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> </head> <body>...