時(shí)遇到文檔格式轉(zhuǎn)換的問題還真不少,PDF轉(zhuǎn)成Word、PPT轉(zhuǎn)成PDF、PDF轉(zhuǎn)成Excel等,都是一些很常見的格式轉(zhuǎn)換需求。而且網(wǎng)上搜也是能搜到一堆的教程,如果想要將Word轉(zhuǎn)成HTML網(wǎng)頁格式,應(yīng)該如何實(shí)現(xiàn)呢?
HTML網(wǎng)頁文件平時(shí)用的比較少,但是在有些時(shí)候我們可能需要將word轉(zhuǎn)換為HTML來使用,這里小編就給大家講解一下如何將word轉(zhuǎn)換為html的。
第一步、在電腦上雙擊打開PDF轉(zhuǎn)換器,然后選擇“Word轉(zhuǎn)換”;
第二步、接著在這里選中“Word轉(zhuǎn)HTML”轉(zhuǎn)換功能;
第三步、如圖,點(diǎn)擊添加文件或者直接將轉(zhuǎn)換的文檔添加進(jìn)來即可,可批量添加多個(gè)進(jìn)行轉(zhuǎn)換;
第四步、在這里根據(jù)自己的需要設(shè)置輸出目錄;
第五步、最后,點(diǎn)擊“開始轉(zhuǎn)換”就可以了;
第六步、得到以下提示,說明文件轉(zhuǎn)換成功,點(diǎn)擊前往導(dǎo)出文件位置就可以瀏覽轉(zhuǎn)換好的文件;
第七步、如圖,以下就是轉(zhuǎn)換好的HTML網(wǎng)頁文件啦!
用js工具wordexport將頁面導(dǎo)出為Word文檔
最近工作方面接到新需求,要將頁面中的person信息導(dǎo)出為Word。
網(wǎng)上查了查,部分都是從JS入手。
親自試用了一些JS工具,發(fā)現(xiàn)稂莠不齊。
不過最終還是找到了一個(gè)中意的"flower"-->wordexport.js。
導(dǎo)出效果還是不錯(cuò)的,詳情見下方。
目的:
一方面向大家推薦,另一方面希望大家可以不吝賜教,推薦一些更為好用的工具。
案例:
測試案例的結(jié)構(gòu),比較簡單。
(1) 下載必須的js文件
下面給出GitHub的下載地址
https://github.com/eligrey/FileSaver.js/
https://github.com/markswindoll/jQuery-Word-Export
(2) 導(dǎo)入js文件
一共需要導(dǎo)入3個(gè)js文件
后者依賴于jQuery的jquery.min.js
(3) 把需要導(dǎo)出的person信息放到div中
<div id="printTab">
<table>.......</table>
</div>
(4) 創(chuàng)建一個(gè)導(dǎo)出的按鈕
<button type="button" onClick="exportWord()" style="float: left;margin-left: 15px">
導(dǎo)出Word
</button>
(5) 導(dǎo)出Word事件
<script type="text/javascript">
function exportWord(){
$("#printTab").wordExport("odysee");
}
</script>
補(bǔ)充:
$("#printTab").wordExport("odysee");
這里的odysee為導(dǎo)出的Word的名字。
如果不傳入默認(rèn)為jQuery-Word-Export
其實(shí)可以打開源碼開一下。
如下圖:
(6) 測試
點(diǎn)擊導(dǎo)出Word按鈕
打開odysee文檔
效果還是可以接受的
總結(jié):
從網(wǎng)上找了幾個(gè)js工具,發(fā)現(xiàn)還是這個(gè)比較好用些。
同時(shí)希望大家可以不吝賜教,多多推薦一些更為好用的工具。
下面貼出word.html源碼(如果大家想要原文件請留言或私信)
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
<html>
<head>
<title>人員信息</title>
<script type="text/javascript" src="./jquery.min.js"></script>
<script type="text/javascript" src="./FileSaver.js"></script>
<script type="text/javascript" src="./jquery.wordexport.js"></script>
<script type="text/javascript">
function exportWord(){
$("#printTab").wordExport("odysee");
}
</script>
</head>
<body>
<div style="height:40px">
<button type="button" onClick="exportWord()" style="float: left;margin-left: 15px">
導(dǎo)出Word
</button>
</div>
<!-- 打印表 -->
<div id="printTab">
<div align="center">
<div style="height:40px;font-size:20pt;font-family:Simsun;margin-top: 22px">
<label><font >odysee</font></label>
</div>
<table cellspacing=0 cellpadding=0 style='border-color:black; border-style:solid; BORDER-COLLAPSE:collapse;border:none;table-layout:fixed;word-break:break-all;'>
<tr>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;height:50px;width:60px; border:black 0.5pt solid;overflow:hidden;'>姓 名</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;width:90px; border:black 0.5pt solid;overflow:hidden;'>odysee</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;width:60px; border:black 0.5pt solid;overflow:hidden;'>性 別</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;width:110px; border:black 0.5pt solid;overflow:hidden;'>♂</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;width:75px; border:black 0.5pt solid;overflow:hidden;'>出生年月</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;width:110px; border:black 0.5pt solid;overflow:hidden;'>2019-6-13</td>
</tr>
<tr>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;height:50px;border:black 0.5pt solid;overflow:hidden;'>民 族</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>Linux</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>籍 貫</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>home/odysee/</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>出生地</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>Centos7</td>
</tr>
<tr>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;height:50px;border:black 0.5pt solid;overflow:hidden;'>入 學(xué)<br/>時(shí) 間</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>2017</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>參加工<br/>作時(shí)間</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>2018</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>健康狀況</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>開機(jī)中...</td>
</tr>
<tr>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;height:50px;border:black 0.5pt solid;overflow:hidden;'>電 話</td>
<td style='font-family: "Simsun";font-size: 13pt;text-align: center;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;border:black 0.5pt solid;overflow:hidden;' colspan="2" >call me odysee</td>
<td style='font-size:13pt;font-family:Simsun;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;vertical-align:middle;text-align:center;border:black 0.5pt solid;overflow:hidden;'>郵 箱</td>
<td style='font-family: "Simsun";font-size: 13pt;text-align: center;border-top:0.5pt solid;border-right:0.5pt solid;border-bottom:0.5pt solid;border-left:0.5pt solid;border:black 0.5pt solid;overflow:hidden;' colspan="2" >I am in toutiao</td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>
*請認(rèn)真填寫需求信息,我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。