docx.js：JavaScriptで記述のテキストをWordファイルとして出力・ダウンロードする方法

docx.jsを使ってJavaScript処理内に記述のテキスト情報をWordファイルのテキスト情報として生成し、出力・ダウンロードする方法をご紹介します。

JavaScriptで記述のテキストをWordファイルとして出力・ダウンロードするCSSの記述

※以下は特に重要ではないので、必要に応じて変更して下さい。

<style>
body{
	font-family:Verdana,"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W6",Osaka,"ＭＳ Ｐゴシック",Arial,sans-serif;
	padding: 0;
	margin: 0;
}
.clWrap{
	width:800px;
	margin:0 auto;
	text-align:center;
}
h1{
	font-size:18px;
	line-height:1.4em;
	text-align:center;
	font-weight:normal;
}
</style>

docx.jsを使ってJavaScriptで記述のテキストをWordファイルとして出力・ダウンロードするJavaScriptの記述

※jquery.min.js、base64.js、jszip.js、docx.jsファイルを読み込みます。DOCXjs()を宣言し、「宣言した変数.text(Wordに出力するテキスト)」でWordファイルにテキストが出力されます。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="./libs/base64.js"></script>
<script type="text/javascript" src="./libs/jszip/jszip.js"></script>
<script type="text/javascript" src="docx.js"></script>
<script>
function fncDoc() {
	var doc = new DOCXjs();
	doc.text('JavaScriptの処理内に記述のテキスト情報を');
	doc.text('Wordファイルのテキスト情報として出力してます。');
	var output = doc.output('datauri');

}
</script>

JavaScriptで記述のテキストをWordファイルとして出力・ダウンロードすHTMLの記述

※hrefにjavascript:fncDoc()を設定するとリンククリックでWordファイルがダウンロードできます。必要に応じて変更して下さい。

<div class="clWrap">
    <h1>以下の「ダウンロード」リンククリック後しファイルをダウンロード後、<br />
    ファイル名を「～.doc」「～.docs」に変更して開いてみて下さい。</h1>

	<a href="javascript:fncDoc()">ダウンロード</a>
</div><!--/clWrap-->

docx.jsを使ってWordファイル出力するデモページ

docx.jsを使ってWordファイル出力するデモ

ソース元：すごい！JavaScriptでMS Wordファイルを生成「DOCX.js」

ソース元：すごい！JavaScriptでMS Wordファイルを生成「DOCX.js」

テキストエリア等に入力させた文字をWordファイルとして生成したりも出来そうですが、MS WordがPCにインストールしてれば直接Wordを開いてテキストを入力した方が早いです。

　
※流用される場合は自己責任でお願いします。
　デモページタグ内のGoogleアナリティクスタグは流用しないで下さい。